如何使用JavaScript的map方法转换指定JSON对象结构

嘿，这事儿其实挺简单的，咱们完全可以用JavaScript的map方法来实现，不用写任何for循环。先来看下咱们的原始数据：

const originalData = {
  "id": 12,
  "firstName": "Mohamed",
  "lastName": "Sameer",
  "contactgroups": [
    { "id": 16, "group": { "id": 4, "groupname": "Angular" } },
    { "id": 19, "group": { "id": 5, "groupname": "React" } },
    { "id": 20, "group": { "id": 6, "groupname": "Node" } }
  ]
};

接下来咱们一步到位完成转换：

// 转换逻辑
const transformedData = {
  // 用扩展运算符复制原始对象中不需要修改的属性
  ...originalData,
  // 用map方法提取每个contactgroup里的group id，生成新的groups数组
  groups: originalData.contactgroups.map(item => item.group.id)
};

简单解释一下： #

• ...originalData：这是ES6的扩展运算符，能帮咱们快速把原始对象里的id、firstName、lastName这些不需要改动的属性复制到新对象里，不用手动一个个写，省心又高效。
• originalData.contactgroups.map(...)：map方法会遍历contactgroups数组的每一项，对每一项执行箭头函数里的逻辑——取出当前项中group对象的id，最后把所有提取到的id组合成一个新数组，也就是咱们需要的groups数组。

最后咱们打印一下转换后的结果，就能得到你想要的结构了：

console.log(transformedData);
// 输出结果：
// {
//   id: 12,
//   firstName: "Mohamed",
//   lastName: "Sameer",
//   groups: [4, 5, 6]
// }

内容的提问来源于stack exchange，提问作者Sameer