从 JavaScript 中的数组中删除空字符串

作者

在 JavaScript 中从数组中删除空字符串

Remove Empty Strings from an Array in JavaScript

从数组中删除所有空字符串：

  1. 使用该Array.filter()方法遍历数组。
  2. 检查每个元素是否不等于空字符串。
  3. 该filter()方法将返回一个不包含任何空字符串的新数组。
索引.js
// ✅ Remove all empty strings from an array
const arr = ['a', '', '', 'b', '', 'c'];

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

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

// ---------------------------------------
// ✅ Remove all falsy elements from an array

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

const results2 = arr2.filter(element => {
  return element;
});

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

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

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

在每次迭代中，我们检查每个元素是否不等于空字符串并返回结果。

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

如果您必须经常从数组中删除空字符串，请创建一个可重用的函数。

索引.js
function removeEmptyStrings(array) {
  return array.filter(element => {
    return element !== '';
  });
}

const arr = ['a', '', '', 'b', '', 'c'];

const results = removeEmptyStrings(arr);
console.log(results); // 👉️ [ 'a', 'b', 'c' ]

该函数将一个数组作为参数，并使用该filter()方法从数组中删除所有空字符串。

如果您将空字符串也视为仅包含空格的字符串，请使用该
String.trim()方法。

索引.js
function removeEmptyStrings(array) {
  return array.filter(element => {
    return element.trim() !== '';
  });
}

const arr = ['a', '   ', '   ', 'b', '', 'c'];

const results = removeEmptyStrings(arr);
console.log(results); // 👉️ [ 'a', 'b', 'c' ]

String.trim
()
方法从字符串中删除前导和尾随空格。

有些字符串只包含空格，因此我们使用该String.trim()方法删除前导和尾随空格并将它们从
results数组中排除。

我们经常要做的事情是falsy从数组中删除所有值。

JavaScript 中的虚假值是：false, 0, "", null, undefined, NaN。

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

  1. 使用该Array.filter()方法遍历数组。
  2. 在每次迭代中，返回当前元素。
  3. 该filter()方法将返回一个新数组，该数组仅包含原始数组的真值。
索引.js
const arr = ['a', '', 'b', , undefined, 0, 'c', null, NaN];

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

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

该filter()方法必须确定每个元素的值是真值还是假值，因为它只会将真值添加到results数组中。

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

索引.js
const arr = ['a', '', 'b', , undefined, 0, 'c', null, NaN];

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

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

从数组中删除所有空字符串的另一种方法是使用
Array.forEach()方法。

使用#从数组中删除空字符串forEach()

从数组中删除所有空字符串：

  1. 声明一个存储空数组的新变量。
  2. 使用该Array.forEach()方法遍历数组。
  3. 检查每个元素是否不等于空字符串。
  4. 如果满足条件，则将元素推入结果数组。
索引.js
const arr = ['a', '', '', 'b', '', 'c'];

const results = [];

arr.forEach(element => {
  if (element !== '') {
    results.push(element);
  }
});

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

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

results在每次迭代中，我们在将当前元素推入数组之前检查它是否不等于空字符串。

该results数组不包含空字符串元素。

如果您必须经常这样做，请创建一个可重用的函数。

索引.js
function removeEmptyStrings(array) {
  const newArray = [];

  array.forEach(element => {
    if (element !== '') {
      newArray.push(element);
    }
  });

  return newArray;
}

const arr = ['a', '', '', 'b', '', 'c'];

// 👇️ [ 'a', 'b', 'c' ]
console.log(removeEmptyStrings(arr));

该函数接受一个数组并使用该Array.forEach()方法从数组中删除所有空字符串。

如果需要从数组中删除所有空元素，请使用Array.filter()
方法。

在 JavaScript 中从数组中删除空元素

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

  1. 使用该filter()方法遍历数组。
  2. 检查每个元素是否不等于null或undefined。
  3. 该filter()方法将返回一个仅包含原始数组的非空元素的数组。
索引.js
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()方法将该元素添加到results数组中。

在示例中，我们从数组中删除所有空元素null或元素。undefined

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

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

您的用例可能不同，例如，您还需要排除所有空字符串和NaN值。&&在这种情况下，使用(and) 运算符添加附加条件。
索引.js
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

我们使用了逻辑 AND&&运算符，因此必须满足所有条件才能将元素包含在results数组中。

您可以使用逻辑 AND&&运算符根据需要链接任意多个条件。

–