如何在JavaScript中访问嵌套对象数组的数据？需添加人员详情

一、访问嵌套对象数组数据 #

嵌套对象数组的核心是逐层定位，通过.访问对象属性，通过[索引]访问数组元素，结合循环或数组方法可批量处理数据。

示例数据结构 #

假设我们有如下公司部门-员工的嵌套数据：

const company = {
  departments: [
    {
      id: 1,
      name: "技术部",
      employees: [
        { id: 101, name: "张三", role: "前端开发" },
        { id: 102, name: "李四", role: "后端开发" }
      ]
    },
    {
      id: 2,
      name: "人事部",
      employees: []
    }
  ]
};

单个数据访问 #

直接通过层级路径获取目标值：

// 获取技术部第一个员工的姓名
const firstTechEmpName = company.departments[0].employees[0].name; // 输出：张三

批量遍历访问 #

用forEach遍历所有嵌套数据：

// 打印所有员工的姓名和岗位
company.departments.forEach(dept => {
  console.log(`部门：${dept.name}`);
  dept.employees.forEach(emp => {
    console.log(`- ${emp.name}：${emp.role}`);
  });
});

二、添加人员详情操作 #

添加人员的关键是先定位到目标数组，再用数组的push()方法添加新对象。

示例：给人事部添加新员工 #

1. 找到目标部门（通过find方法匹配部门名称/id）
2. 向该部门的employees数组添加新员工对象

// 定位人事部
const hrDepartment = company.departments.find(dept => dept.name === "人事部");

// 确认找到部门后添加员工
if (hrDepartment) {
  hrDepartment.employees.push({
    id: 201,
    name: "王五",
    role: "招聘专员",
    hireDate: "2024-05-20"
  });
}

复杂嵌套场景（如员工有下属） #

如果嵌套层级更深（比如员工包含subordinates下属数组），逻辑一致：

// 给技术部张三添加下属
const zhangSan = company.departments[0].employees.find(emp => emp.id === 101);
if (zhangSan) {
  // 先初始化下属数组（如果不存在）
  if (!zhangSan.subordinates) zhangSan.subordinates = [];
  zhangSan.subordinates.push({ id: 103, name: "赵六", role: "实习生" });
}

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