为何筛选偶数的JavaScript数组会出现空值？

问题原因 #

你这段代码的问题出在直接通过索引赋值数组元素的方式上：

• 循环遍历原数组时，只有当arr[i]是偶数时，才会给evenNumbers[i]赋值；
• 当arr[i]不是偶数时，evenNumbers的第i个位置根本没有被赋值，数组会自动扩展长度，但这个位置会留下一个空位（empty），也就是控制台显示的结果；
• 举个具体的例子：原数组索引0是1（奇数），所以evenNumbers[0]没被赋值，就会显示empty；索引1是2（偶数），evenNumbers[1]被赋值为2，以此类推。

修正方案 #

有两种简单可靠的修正方式：

方式1：使用数组push()方法

直接把符合条件的元素追加到结果数组末尾，完全不会产生空位：

function getEvenNumbers(arr) {
  const evenNumbers = [];
  for (let i = 0; i < arr.length; i++) {
    if (arr[i] % 2 === 0) {
      evenNumbers.push(arr[i]);
    }
  }
  return evenNumbers;
}
console.log(getEvenNumbers([1, 2, 3, 4, 5, 6])); // 输出: [2, 4, 6]

方式2：使用数组filter()方法

这是更简洁的函数式写法，filter方法会自动返回由符合条件的元素组成的新数组，天然不会有空位：

function getEvenNumbers(arr) {
  return arr.filter(num => num % 2 === 0);
}
console.log(getEvenNumbers([1, 2, 3, 4, 5, 6])); // 输出: [2, 4, 6]

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