JS Object.keys()的使用点

最近工作上遇到一些问题，我这边需要把从后端拿到的一些数据进行绘图。
这里使用的是绘图方式是echarts-for-react，详细使用方法可以见echarts-for-reac的使用方法，根据这个网址里的component props部分，可以知道ReactEchartsCore组件接受的打点的参数是option，话不多说，直接上例子。

我这边需要对目标数据进行object遍历以及array遍历，最后需要得到的是一个数组。

目标数据的数据结构是：

var obj = {
  k1: [ {x:value, y:value},{x:value, y:value} ],
  k2: [ {x:value, y:value},{x:value, y:value} ]
}

这里我需要对obj这个数据进行一些操作，目标是得到一个这样的数据：

var result = [
 {name: "k1",  data: [{x:value, y:value},{x:value, y:value}]},
 {name: "k2",  data: [{x:value, y:value},{x:value, y:value}]}
]

最后我想得到这样的数据类型。

这里从一开始我就没有思考把这个数据结构转变成数组来进行两次map操作来得到自己想要的结果，我一直都是考虑如何遍历这个对象，之后再遍历该对象里某个属性值的数组。

这里用了Object.keys来遍历对象，但是一开始并不明白怎么用，所以我卡住了很久..
这里拿官方的例子来简单说明一下这个方法怎么使用。

const object1 = {
  a: 'somestring',
  b: 42,
  c: false
};

console.log(Object.keys(object1));
// expected output: Array ["a", "b", "c"]

这里可以看到，对象使用了Object.keys()方法变成了一个数组，数组里存储着对象的key值，如果你还需要对该对象key值里的数据进行操作，可以用map来遍历这个存储了key值的数组，来达到目的。

比如，我在绘图的时候，需要拿到一个数组类型给options的series属性，对于我刚开始拿出的例子来说，解决办法就是：

var result = Object.keys(obj).map(key => {
  name: key,
  data: obj[key].map(dataItem => {
    dataItem.x,
    dataItem.y
  })
})

哈哈哈我只是记录一下工作，如果这篇文章没有给你们带来帮助的话....就....点个赞再走吧～