如何将嵌套JavaScript对象重构为扁平化键值对数组？

嘿，我来帮你搞定这个嵌套对象转扁平化数组的问题！其实核心就是用递归遍历的方式钻透整个对象结构，把最内层的键值对（包括数组类型的值）直接提取出来放到结果数组里。

具体实现思路 #

1. 先初始化一个空数组，用来装最终的扁平化结果。
2. 写一个递归遍历函数，专门处理对象的每一层：
   • 遍历当前对象的所有键值对；
   • 如果当前值是普通对象（不是数组也不是null），就递归调用这个函数继续深入处理；
   • 如果当前值是数组、字符串、数字、布尔值这类非对象类型，就把它包装成{key: 键名, val: 值}的格式，加入结果数组；
   • 注意：你给出的示例里把数字类型的Age:18转成了字符串"18"，所以处理的时候要额外做个类型转换，不需要的话可以直接去掉这一步。

完整代码示例 #

const nestedObj = { 
  "Name": "Peter", 
  "Username": "dummy", 
  "Age": 18, 
  "moreData": { 
    "tags": [1,2,3], 
    "hasCar": true, 
    "preferences": { 
      "colors": ["green", "blue"] 
    } 
  } 
};

function flattenObj(obj) {
  const result = [];
  
  // 递归遍历函数
  function traverse(currentObj) {
    // 用Object.entries遍历键值对，避免原型链属性干扰
    for (const [key, val] of Object.entries(currentObj)) {
      // 区分普通对象、数组和其他类型
      if (typeof val === 'object' && val !== null && !Array.isArray(val)) {
        // 是嵌套对象，继续递归
        traverse(val);
      } else {
        // 处理数字转字符串的需求，不需要可以直接用val
        const processedVal = typeof val === 'number' ? String(val) : val;
        result.push({ key, val: processedVal });
      }
    }
  }
  
  // 启动遍历
  traverse(obj);
  return result;
}

// 执行测试
console.log(flattenObj(nestedObj));

代码关键点说明 #

• 用Object.entries遍历对象比传统的for...in更安全，不会遍历到原型链上的额外属性；
• 加了val !== null的判断，因为typeof null会返回'object'，避免把null当成对象处理；
• 专门排除了数组类型，确保像tags、colors这类数组直接作为值保留在结果里，完全符合你的需求。

如果以后需要调整规则（比如要保留完整路径如moreData.tags，或者要扁平化数组里的每个元素），只需要修改递归逻辑里的键名拼接或者数组处理部分就行啦！

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