JS使用Reduce对嵌套数字数组指定位置元素求和返回NaN问题求解

原来的代码输出NaN是因为没有给reduce传入初始累加值：

• 第一次迭代时，prev是第一个子数组[1,2,3]，prev[2] + curr[2]计算得到3+6=9
• 第二次迭代时，prev已经是数字类型的9，访问9[2]会得到undefined，undefined和数字相加结果就是NaN

固定求和下标为2的写法 #

给reduce设置初始累加值为0，每次迭代直接取当前子数组对应下标的值累加即可：

const array1 = [[1,2,3],[4,5,6],[7,8,9],[11,12,13]];
// 初始值设为0，prev始终是累加的数字结果
const sum = array1.reduce((prev, curr) => prev + curr[2], 0);
console.log(sum); // 输出 3+6+9+13 = 31

通用封装版本 #

如果需要灵活指定求和的下标，可以封装成带边界判断的函数，避免子数组下标越界导致的异常：

function sumBySubIndex(arr, index) {
  return arr.reduce((prev, curr) => {
    // 对应下标不存在时默认加0，避免出现NaN
    return prev + (curr[index] ?? 0)
  }, 0)
}

const array1 = [[1,2,3],[4,5,6],[7,8,9],[11,12,13]];
console.log(sumBySubIndex(array1, 2)); // 输出31
console.log(sumBySubIndex(array1, 0)); // 输出1+4+7+11 = 23

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