js怎么从数组取非空值

要从JavaScript数组中取出非空值，可以使用以下几种方法：使用filter方法、使用for循环、使用reduce方法。其中，使用filter方法是最简洁和常用的方法。下面将详细介绍如何使用这种方法。

在JavaScript中，数组是一个非常常用的数据结构。我们有时会遇到需要从数组中提取非空值的情况，这种需求可以通过多种方法实现。filter方法是最直接也是最常用的方法，它可以过滤掉数组中的空值，返回一个新的包含非空值的数组。

一、使用filter方法

filter方法是JavaScript数组的一个内置方法，它会创建一个新数组，新数组中的元素是通过检查指定条件的所有元素。我们可以利用这个方法来过滤掉数组中的空值。

let array = [1, null, 2, undefined, 3, '', 4, NaN, 5];
let nonEmptyArray = array.filter(item => item !== null && item !== undefined && item !== '' && !Number.isNaN(item));
console.log(nonEmptyArray); // [1, 2, 3, 4, 5]

在上面的例子中，我们使用filter方法并传递了一个回调函数，该函数检查每个元素是否为非空值。如果该元素不是null、undefined、空字符串''或NaN，则将其包含在返回的新数组中。

深入理解filter方法

filter方法会对数组中的每个元素执行一次提供的回调函数，并创建一个新数组，包含所有返回true的元素。这个方法不会改变原始数组。

let array = [1, 2, 3, 4, 5];
let evenNumbers = array.filter(item => item % 2 === 0);
console.log(evenNumbers); // [2, 4]

在这个例子中，filter方法仅保留了数组中的偶数。

二、使用for循环

虽然filter方法非常简洁，但是在某些情况下，我们可能更倾向于使用传统的for循环来实现同样的功能。

let array = [1, null, 2, undefined, 3, '', 4, NaN, 5];
let nonEmptyArray = [];
for (let i = 0; i < array.length; i++) {
    if (array[i] !== null && array[i] !== undefined && array[i] !== '' && !Number.isNaN(array[i])) {
        nonEmptyArray.push(array[i]);
    }
}
console.log(nonEmptyArray); // [1, 2, 3, 4, 5]

在这个例子中，我们使用for循环遍历数组，并手动检查每个元素是否为非空值。如果是非空值，则将其添加到nonEmptyArray中。

优化for循环

虽然上述方法已经可以满足需求，但我们还可以进一步优化代码。比如，我们可以使用continue语句来简化代码结构。

let array = [1, null, 2, undefined, 3, '', 4, NaN, 5];
let nonEmptyArray = [];
for (let i = 0; i < array.length; i++) {
    if (array[i] === null || array[i] === undefined || array[i] === '' || Number.isNaN(array[i])) {
        continue;
    }
    nonEmptyArray.push(array[i]);
}
console.log(nonEmptyArray); // [1, 2, 3, 4, 5]

使用continue语句可以使代码更加简洁和可读。

三、使用reduce方法

reduce方法也是JavaScript数组的一个内置方法，它可以通过一个累加器函数迭代数组中的每个元素，并将其结果累积到一个最终的值中。我们可以利用reduce方法来实现从数组中提取非空值的功能。

let array = [1, null, 2, undefined, 3, '', 4, NaN, 5];
let nonEmptyArray = array.reduce((acc, item) => {
    if (item !== null && item !== undefined && item !== '' && !Number.isNaN(item)) {
        acc.push(item);
    }
    return acc;
}, []);
console.log(nonEmptyArray); // [1, 2, 3, 4, 5]

在这个例子中，我们使用reduce方法遍历数组，并将非空值累积到acc（累加器）中。最终返回的acc就是一个包含所有非空值的新数组。

深入理解reduce方法

reduce方法会对数组中的每个元素执行一次提供的累加器函数，并将其结果累积到一个最终的值中。该方法接受两个参数：一个累加器函数和一个初始值。

let array = [1, 2, 3, 4, 5];
let sum = array.reduce((acc, item) => acc + item, 0);
console.log(sum); // 15

在这个例子中，reduce方法计算数组中所有元素的和。

总结

在JavaScript中，从数组中提取非空值可以通过多种方法实现。最常用和最简洁的方法是使用filter方法，但在某些情况下，我们也可以使用传统的for循环或功能强大的reduce方法。