javascript 无法使用嵌套值映射对象数组答案

【问题标题】：javascript cannot map array of objects with nested valuesjavascript 无法使用嵌套值映射对象数组
【发布时间】：2019-11-25 03:41:58
【问题描述】：

尝试使用嵌套在子对象结构中的值映射对象数组，例如：

const objs = [{
        "B": {
            "value": 1,
        },
        "D": {
            "value": "45"
        },
        "E": {
            "value": "234"
        },
        "A": {
            "value": "543"
        },
        "C": {
            "value": "250"
        }
    },...]

结构如下：

[
  { name: 'B', value: 1 }, 
  { name: 'D', value: '45' }, 
  { name: 'E', value: '234' }, 
  { name: 'A', value: '543' },
  { name: 'C', value: '250' }
]

映射的结果是undefined

const mapped = objs.map((key, index) => {
  Object.keys(key).map(el => ({
    name: el
  }))
})

示例：Stackblitz

【问题讨论】：

return 丢失。

标签： javascript arrays typescript mapping javascript-objects

【解决方案1】：

您缺少return 语句和value 属性定义。

此外，您可能希望使用flatMap 而不是map 以避免结果中出现嵌套数组：

const objs = [{
    "B": {
        "value": 1,
    },
    "D": {
        "value": "45"
    },
    "E": {
        "value": "234"
    },
    "A": {
        "value": "543"
    },
    "C": {
        "value": "250"
    }
}]

const mapped = objs.flatMap((key, index) => {
    return Object.keys(key).map(el => ({
        name: el,
        value: key[el].value
    }))
})

console.log(mapped)

【讨论】：

很好的例子。有没有办法像示例中那样通过迭代保持元素的顺序？
谢谢！结果中对象的顺序与键的顺序不同吗？在我这边，它似乎是相同的（B、D、E、A、C）。

【解决方案2】：

你应该对 objs[0] 进行操作，而不是 objs，因为它是一个对象的数组，而不是对象的数组。

let array = []
for(let object in objs[0]){
array.push({
"name": object,
"value": objs[0][object].value
})
}

【讨论】：

我的错，我没有添加整个数据结构（只是三个点），有像stackblitz示例中的对象数组。

【解决方案3】：

Object.keys 中缺少return。也可以使用 Object.entries 代替 Object.keys 来获取 key 和 value。

const objs = [{
  "B": {
    "value": 1,
  },
  "D": {
    "value": "45"
  },
  "E": {
    "value": "234"
  },
  "A": {
    "value": "543"
  },
  "C": {
    "value": "250"
  }
}];
const mapped = objs.map((key, _) => {
  return Object.entries((key)).map(([name, {
    value
  }]) => ({
    name,
    value
  }))
}).flat();

console.log(mapped);

【讨论】：