如何获取JavaScript中嵌套对象/数组的值及指定嵌套对象的所有值

嘿，这两个问题都是JavaScript开发中经常碰到的嵌套数据处理场景，我来给你详细拆解一下解决方案！

在处理嵌套数据时，不同场景有不同的高效解法，下面是几种常用方案：

方法1：直接链式访问（需处理空值陷阱） #

如果你确定嵌套路径上的每个属性/索引都存在，可以直接用链式语法：

const value = obj.firstSection.totalIncome;

但如果中间某个节点是null或undefined，这种写法会直接抛出错误。老版本JS里会用多层短路判断规避：

const value = obj && obj.firstSection && obj.firstSection.totalIncome;

不过这种写法太冗长，现在更推荐下面的方案。

方法2：可选链操作符（?.）+ 空值合并（??）ES2020+ #

这是目前最简洁安全的写法，?.会自动跳过null/undefined节点，不会报错；如果需要给默认值，可以搭配??（区别于||，它只在值为null/undefined时生效）：

// 获取嵌套值，不存在则返回undefined
const totalIncome = report?.report?.firstSection?.totalIncome;
// 带默认值的写法
const category = report?.report?.firstSection?.category ?? '未分类';

对于数组索引，同样适用：

// 假设数组嵌套：const arr = [ { data: 123 } ]
const arrValue = arr?.[0]?.data;

方法3：递归路径查找（适用于动态路径） #

如果你的嵌套路径是动态生成的（比如从用户输入或配置里拿到路径数组），可以写一个通用的递归函数：

function getNestedValue(target, path) {
  let current = target;
  for (const key of path) {
    if (current == null) return undefined; // 处理null/undefined
    current = current[key];
  }
  return current;
}

// 使用示例：动态路径获取值
const path = ['report', 'secondSection', 'subTotals', 'intTotal'];
const intTotal = getNestedValue(report, path); // 输出6295.166666666666

针对你给出的report对象，要收集所有层级的属性值（包括null、数字、字符串等），可以写一个递归遍历函数，自动遍历所有嵌套节点：

function getAllNestedValues(obj) {
  const values = [];

  // 内部递归遍历函数
  function traverse(current) {
    // 先处理数组情况（如果存在数组嵌套）
    if (Array.isArray(current)) {
      current.forEach(item => traverse(item));
      return;
    }
    // 处理非null的对象，继续递归遍历它的属性值
    if (typeof current === 'object' && current !== null) {
      Object.values(current).forEach(val => traverse(val));
      return;
    }
    // 基础类型（包括null）直接加入结果数组
    values.push(current);
  }

  traverse(obj);
  return values;
}

// 你的目标对象
const report = { 
  "report": { 
    "firstSection": { 
      "totalIncome": 9650000, 
      "category": null, 
      "mustPay": null, 
      "tax": null, 
      "bef": null, 
      "message": "Los ingresos exceden el monto máximo para la modalidad monotributo" 
    }, 
    "secondSection": { 
      "subTotals": { 
        "intTotal": 6295.166666666666, 
        "ordTotal": 3884679.201041667 
      }, 
      "unitaryProductionCost": 247.55291005291008, 
      "unitaryInfo": { 
        "unitarySalesCost": 16338.425925925927, 
        "unitarySalesPrice": 23536.585365853 
      } 
    } 
  }
};

// 调用函数获取所有值
const allValues = getAllNestedValues(report);
console.log(allValues);

运行这段代码后，你会得到一个包含所有层级值的数组：[9650000, null, null, null, null, "Los ingresos exceden el monto máximo...", 6295.166..., 3884679.201..., 247.552..., 16338.425..., 23536.585...]

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