JavaScript Reduce函数实现年龄过滤时触发TypeError报错求助

嘿，我懂你想用reduce替代filter来筛选18岁及以上人员的需求，遇到的TypeError: Cannot read property 'push' of undefined其实是个很常见的小坑——你没给reduce指定初始累加器值，咱们来一步步搞定它！

问题根源 #

当调用reduce时如果不传入初始值，第一次执行回调函数时，累加器acc会默认取数组的第一个元素（如果数组非空），而不是你需要的空数组。这时候你尝试调用acc.push()，要么因为第一个元素是对象没有push方法报错，要么如果数组为空直接得到undefined，自然会触发这个错误。

正确实现代码 #

首先假设咱们有这样的人员数据：

const people = [
  { name: 'Alice', age: 22 },
  { name: 'Bob', age: 17 },
  { name: 'Charlie', age: 30 },
  { name: 'Diana', age: 16 }
];

用reduce实现筛选的正确写法如下：

const adults = people.reduce((acc, person) => {
  // 符合条件就往累加器数组里push当前人员
  if (person.age >= 18) {
    acc.push(person);
  }
  // 必须返回累加器，供下一次迭代使用
  return acc;
}, []); // 这里的[]就是你要定义的结果数组！作为reduce的初始值传入

console.log(adults);
// 输出结果: [{ name: 'Alice', age: 22 }, { name: 'Charlie', age: 30 }]

额外小技巧 #

如果你喜欢更简洁的写法，也可以用数组展开运算符（不过push的性能会更好一些）：

const adults = people.reduce((acc, person) => {
  return person.age >= 18 ? [...acc, person] : acc;
}, []);

关键注意点 #

• 存储结果的数组就是你传给reduce的第二个参数[]，这是初始化累加器的位置，不能省略！
• 回调函数里一定要返回累加器acc，不然下一次迭代的累加器会变成undefined，同样会触发类似的错误。

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