迹忆客 专注技术分享

JavaScript 中从数组中删除所有空元素：

1. 调用 filter() 方法，向其传递一个函数。
2. 对于数组中的每个元素，检查其值是否不等于 null 且不等于 undefined。
3. filter 方法返回一个只包含满足条件的元素的新数组。

const arr = ['a', , 'b', , undefined, 0, 'c', null];

const results = arr.filter(element => {
  return element !== null && element !== undefined;
});

console.log(results); // ['a', 'b', 0, 'c']

我们传递给 Array.filter 方法的函数会被数组中的每个元素调用。

如果函数返回真值，则 filter 方法将该元素添加到结果数组。

在示例中，我们从结果数组中删除所有排除所有空、空或未定义的元素。

请注意，空元素会自动删除，因为该函数永远不会用空元素调用。

filter 方法不会改变原始数组的内容。 它返回一个新数组，只包含满足条件的元素。

请注意 ，我们使用了 && (And) 运算符，它仅在两个条件都返回 true 时才返回 true。

我们的用例可能不同，例如 我们还需要排除所有空字符串和 NaN 值。 在那种情况下，我们可以使用 &&（与）运算符添加其他条件。

const arr = ['a', '', 'b', , undefined, 0, 'c', null, NaN];

const results = arr.filter(element => {
  return (
    element !== null &&
    element !== undefined &&
    element !== '' &&
    !Number.isNaN(element)
  );
});

console.log(results); // 👉️ ['a', 'b', 0, 'c']

在示例中，我们将所有空、undefined、null、空字符串或 NaN 元素排除在添加到结果数组之外。

因为我们使用 && （和）运算符，所以只有满足所有条件时才满足条件。

一个非常常见的场景是必须从数组中删除所有虚假值。

JavaScript 中的假值有：false、0、""、null、undefined、NaN。

要从数组中删除所有虚假值：

1. 调用 filter() 方法，向其传递一个函数。
2. 在函数的每次迭代中返回当前元素。
3. filter 方法将返回一个新数组，其中仅包含真值。

const arr = ['a', '', 'b', , undefined, 0, 'c', null, NaN];

const results = arr.filter(element => {
  return element;
});

console.log(results); // ['a', 'b', 'c']

filter 方法必须确定每个元素的值是真值还是假值，因为它只将真值添加到结果数组。

我们可以想象每个元素都被传递给 Boolean() 构造函数，并且只有真实元素返回 true 并包含在新数组中。

使用 forEach 从数组中删除空元素

另一种可能更容易阅读的方法是改用 forEach 方法。

从数组中删除所有空元素：

1. 创建一个空数组来存储结果。
2. 使用 forEach() 方法迭代数组。
3. 在每次迭代中检查当前元素是否不等于 null 且不等于 undefined。
4. 如果满足条件，则将元素推入结果数组。

const arr = ['a', , 'b', , undefined, 0, 'c', null];

const results = [];

arr.forEach(element => {
  if (element !== null && element !== undefined) {
    results.push(element);
  }
});

console.log(results); // 👉️ ['a', 'b', 0, 'c']

我们传递给 Array.forEach 方法的函数会针对数组中的每个元素进行调用。

在示例中，我们检查每个元素是否不等于 null 和 undefined，然后再将其推入结果数组。

我们可以添加更多条件，例如 要检查元素是否不是空字符串，请使用 &&（和）运算符添加另一个条件。

对于新开发人员来说，这种方法更容易阅读，因为我们不必深入了解 filter 方法如何解决问题的细节。