如何用JavaScript检查嵌套数组属性并移除空value元素

问题1：如何使用JavaScript检查嵌套数组对象中是否存在特定属性？ #

分两种场景处理：

1. 已知嵌套结构，检查指定层级的属性 #

如果明确知道对象的嵌套路径，直接通过链式访问结合in运算符或者hasOwnProperty即可判断：

// 示例：检查arrobj中第一个对象的task数组第一个元素是否有tid属性
const hasTid = 'tid' in arrobj[0].task[0];
// 或者用hasOwnProperty（仅检查自身属性，不包含原型链）
const hasValue = arrobj[0].task[0].hasOwnProperty('value');

2. 未知嵌套结构，递归检查所有层级 #

如果不确定嵌套深度，需要递归遍历所有对象和数组，判断是否存在目标属性：

function hasNestedProperty(obj, prop) {
  // 检查当前对象是否包含目标属性
  if (typeof obj === 'object' && obj !== null) {
    if (prop in obj) return true;
    // 遍历对象属性，递归检查值
    for (const key in obj) {
      if (hasNestedProperty(obj[key], prop)) return true;
    }
  }
  // 遍历数组元素，递归检查
  if (Array.isArray(obj)) {
    for (const item of obj) {
      if (hasNestedProperty(item, prop)) return true;
    }
  }
  return false;
}

// 调用示例：检查arrobj中是否存在'tid'属性
console.log(hasNestedProperty(arrobj, 'tid')); // 输出true

问题2：处理嵌套数组，移除task子数组中value为空的对象 #

原代码的问题 #

你的尝试代码存在两处错误：

1. 拼写错误：e.tasks应为e.task（原数组的属性名是task）
2. 逻辑不完整：仅过滤了外层数组，未修改每个对象内部的task数组，也未处理过滤后task为空的情况

正确实现代码 #

var arrobj = [
  {
    id: 1,
    task: [
      {tid:1, value:[]},
      {tid:2, value:[12,13]}
    ]
  },
  {
    id: 2,
    task: [
      {tid:4, value:[14,15]}
    ]
  }
];

const processedArr = arrobj.map(item => {
  // 过滤当前对象的task数组，保留value不为空的项
  const filteredTasks = item.task.filter(taskItem => taskItem.value.length > 0);
  // 返回新对象，避免修改原数组引用
  return { ...item, task: filteredTasks };
// 过滤掉处理后task数组为空的外层对象
}).filter(item => item.task.length > 0);

console.log(processedArr);

代码说明 #

1. map遍历外层数组：对每个对象处理其task子数组，用filter移除value为空数组的项
2. filter外层数组：若某个对象处理后的task数组为空，则将该对象从结果中移除
3. 展开运算符...：创建原对象的副本，避免直接修改原数组

输出结果 #

运行后会得到预期结果：

[
  {
    id: 1,
    task: [
      {tid:2, value:[12,13]}
    ]
  },
  {
    id: 2,
    task: [
      {tid:4, value:[14,15]}
    ]
  }
]

若原数组中所有对象的task子数组处理后都为空，最终会返回[]，符合题目要求。

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