JavaScript中filter处理后原数组未改变？参数传递原理解惑

首先要纠正一个误区：JavaScript的参数传递不是“按引用传递”，而是按值传递——对于引用类型（比如数组），传递的是内存地址的副本，不是直接传递变量本身的引用。

你的代码问题出在哪？ #

• 当你把外部的toFilter数组传入函数时，函数内部的toFilter变量只是拿到了原数组地址的一个副本。
• filter方法的特性是返回一个全新的数组，不会对原数组做任何修改。
• 你在函数里执行toFilter = toFilter.filter(...)，只是把新数组的地址赋值给了函数内部的toFilter变量，这相当于替换了内部变量的指向，和外部的原数组变量已经没有关联了，所以外部的原数组自然不会变化。

两种解决方式 #

方式1：直接修改原数组

如果需要直接改变原数组，可以用splice方法原地删除不符合条件的元素：

function getNumerics(toFilter) {
  // 从后往前遍历，避免删除元素后索引错乱
  for (let i = toFilter.length - 1; i >= 0; i--) {
    if (isNaN(toFilter[i])) {
      toFilter.splice(i, 1);
    }
  }
  console.log(toFilter);
}

var toFilter = [1, 'z', '4', 2, 6];
getNumerics(toFilter);
console.log(toFilter); // 输出 [1, '4', 2, 6]

方式2：返回新数组并重新赋值

更推荐这种方式（避免原地修改数组带来的副作用），让函数返回过滤后的新数组，再覆盖原变量：

function getNumerics(toFilter) {
  const filteredArr = toFilter.filter(element => !isNaN(element));
  console.log(filteredArr);
  return filteredArr;
}

var toFilter = [1, 'z', '4', 2, 6];
toFilter = getNumerics(toFilter);
console.log(toFilter); // 输出 [1, '4', 2, 6]

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