如何扁平化对象数组并移除重复的Id键

我来帮你搞定这个问题！你的需求是把嵌套的结构扁平化，把内层moreDetails.items里的City、State属性提上来和外层对象合并，同时去掉重复的Id（其实内层Id和外层完全一致，直接保留外层的就可以）。

先说说你之前尝试里的问题：

• Array.flat()是用来处理数组嵌套数组的情况，而你的数据是对象里嵌套对象，所以这个方法完全不适用；
• 你写的for循环逻辑有明显错误：比如!typeof arr[key].moreDetails === 'object'的判断逻辑写反了，而且result2.push(arr[key2])是取原数组的第key2个元素，不是当前项的items里的内容，自然得不到想要的结果。

正确的解决方案 #

其实这个需求用Array.map()就能轻松实现，因为原数组的每个元素正好对应结果数组里的一个元素，map方法非常适合这种一对一的转换：

const arr =  [
      {
        "First Name": "ABC",
        "Last Name": "XYZ",
        "Gender": "MALE",
        "Id": "123",
        "moreDetails": {
          "items": [
            {
              "Id": "123",
              "City": "BLR",
              "State": "KA"
            }
          ]
        }
      },
      {
        "First Name": "Test",
        "Last Name": "Me",
        "Gender": "FEMALE",
        "Id": "12345",
        "moreDetails": {
          "items": [
            {
              "Id": "12345",
              "City": "KAN",
              "State": "UP"
            }
          ]
        }
      }
    ];

const result = arr.map(item => {
  // 解构外层所有属性，排除不需要的moreDetails
  const { moreDetails, ...rest } = item;
  // 从嵌套的items数组中取出第一个对象的City和State
  const { City, State } = moreDetails.items[0];
  // 合并所有属性，返回新的扁平化对象
  return { ...rest, City, State };
});

console.log(result);

代码逻辑解释 #

1. 解构外层属性：用{ moreDetails, ...rest }把外层对象中除了moreDetails的所有属性（包括First Name、Last Name、Gender、Id）提取到rest对象里；
2. 提取嵌套属性：观察你的数据可知，每个moreDetails.items数组里只有一个对象，所以直接取items[0]，再解构出需要的City和State；
3. 合并对象：用展开运算符...rest把外层属性展开，再加上City和State，得到最终的扁平化对象，同时Id只保留了一份（和内层的取值完全一致）。

输出结果 #

运行这段代码后，得到的结果正好是你期望的格式：

[
  {
    "First Name": "ABC",
    "Last Name": "XYZ",
    "Gender": "MALE",
    "Id": "123",
    "City": "BLR",
    "State": "KA"
  },
  {
    "First Name": "Test",
    "Last Name": "Me",
    "Gender": "FEMALE",
    "Id": "12345",
    "City": "KAN",
    "State": "UP"
  }
]

备注：内容来源于stack exchange，提问作者mkchoube