JS使用filter方法计算数组数字平均值时取值异常求助

错误原因 #

• filter回调逻辑错误：代码中arr.filter(arr => typeof arr[i] === "number")写法有误，回调参数应为数组单个元素，且不应依赖外层循环的i变量，导致过滤结果不符合预期。
• 计算逻辑冗余混乱：外层遍历原数组的同时，else分支又重复遍历过滤后的数组，会导致数字被重复累加；且if分支内计算平均值时直接使用原数组arr.length作为分母，是分母取值错误的直接原因。
• 平均值赋值时机错误：每次循环都重新给avg赋值，最终返回的avg是最后一次循环的计算结果，并非整体统计后的正确平均值。

修复后代码 #

const bills = [[], 4, 42, 9, "error"];

const calcAverage = function (arr) {
    // 先过滤得到纯数字数组
    const newArr = arr.filter(item => typeof item === "number");
    // 处理空数组边界，避免除以0报错
    if (newArr.length === 0) return 0;
    let sum = 0;
    // 仅遍历纯数字数组累加求和
    for (let i = 0; i < newArr.length; i++) {
        sum += newArr[i];
    }
    // 遍历完成后一次性计算平均值
    return sum / newArr.length;
}

console.log(calcAverage(bills)); // 输出结果：18.333333333333332

简化实现（可选） #

使用reduce方法可以进一步简化求和逻辑：

const calcAverage = arr => {
  const nums = arr.filter(item => typeof item === 'number')
  return nums.length ? nums.reduce((sum, num) => sum + num, 0) / nums.length : 0
}

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