map 与 filter 的区别

问题

map 和 filter 有什么区别？

解答

参数

两者的参数完全相同：

array.map(function(currentValue, index, arr), thisValue)
array.filter(function(currentValue, index, arr), thisValue)

• currentValue：当前数组元素
• index：当前索引
• arr：原数组
• thisValue：回调函数中 this 的指向

用途区别

map 返回的新数组与原数组长度相同，对每个元素进行转换处理：

let arr = ["1", "2", "3"];
let a = arr.map((item, index, a) => {
    return item + 1;
});
console.log(a); // ["11", "21", "31"]

filter 返回的新数组是过滤后的结果，长度可能不同，元素值不变：

let arr = ["1", "2", "3"];
let b = arr.filter((item, index, a) => {
    return item > 1;
});
console.log(b); // ["2", "3"]

filter 过滤假值

filter 可以过滤掉 NaN、null、undefined、0 等假值：

let arr = [NaN, null, undefined, "0", 0, 1, 2, 3];
let newArr = arr.filter(item => item);
console.log(newArr); // ["0", 1, 2, 3]

关键点

• map 和 filter 的参数签名完全相同
• map 返回转换后的数组，长度与原数组相同
• filter 返回过滤后的数组，长度可能改变，元素值不变
• filter 可用于过滤假值（NaN、null、undefined、0）