JS高阶函数

map（生成新数组）

map是定义在Array上的一个方法，接收一个函数作为参数，返回一个新的数组（即便数组元素是undefined和null），不改变原数组

map的处理速度比forEach快

例：

function pow(x) {
    return x * x;
}
var arr1 = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var results1 = arr.map(pow); 
// [1, 4, 9, 16, 25, 36, 49, 64, 81]

var arr2 = [1, 2, 3, 4, 5, 6, 7, 8, 9];
var results2 = arr2.map(String); 
 // ['1', '2', '3', '4', '5', '6', '7', '8', '9']

// 数组去重（不推荐）
var arr3 = [1, 2, 1, 4, 3, 4, 7, 5, 9];
arr3 = arr3.map((item, index, Array) => {
　　if (Array.indexOf(item) === index) {
　　　　return item;
　　}
});
// [1,2,undefined,4,3undefined,7,5,9]
// 作用于每个数组项，对不符合要求的并不会剔除（filter会剔除不符合项）

forEach

它也把每个元素依次作用于传入的函数，不修改原数组，不会返回新的数组（默认无返回值，返回结果undefined）

forEach()常用于遍历数组，因此，传入的函数不需要返回值

reduce（生成新数组）

Array上的reduce也是接收一个函数，把该函数作用在这个Array的每一项上，该函数必须接收两个参数，把结果接续和序列的下一个元素做累加计算：

[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)

例：

var arr = [1, 5, 3, 5, 7, 7, 9];
arr.reduce(function (x, y) {
    return x + y;
}); // 37

// 数组去重
const newArray = arr.reduce((defaultArray, element) => {
　　if (!defaultArray.includes(element)) {
　　　　defaultArray.push(element);
　　}
　　return defaultArray;
}, []);// 初始化
// [1, 3, 5, 7, 9];

 filter（生成新数组）

用于把Array中的某些元素过滤掉，然后返回剩下的元素，filter将传入的函数作用于数组中的每个元素，

根据返回值是true还是false决定是否保留该元素,通过这个高阶函数可以实现一个筛选的效果

例:

var arr = [1, 2, 4, 5, 6, 9, 10, 15];
var r = arr.filter(function (x) {
    return x % 2 !== 0;
});
// [1, 5, 9, 15]

//数组去重：
var arr = ['apple', 'strawberry', 'banana', 'pear', 'apple', 'orange', 'orange', 'strawberry'];
r = arr.filter(function (element, index, self) {
    return self.indexOf(element) === index;
});
// ['apple', 'strawberry', 'banana', 'pear', 'orange']

sort（对原数组操作）

通常规定，对于两个元素x和y，如果认为x < y，则返回-1，如果认为x == y，则返回0，如果认为x > y，则返回1，

这样，排序算法就不用关心具体的比较过程，而是根据比较结果直接排序

// 字符串根据ASCII码进行排序
['Google', 'apple', 'Microsoft'].sort(); // ['Google', 'Microsoft", 'apple']

// 默认把所有元素先转换为String再排序
[10, 20, 1, 2].sort(); // [1, 10, 2, 20]

// 接收一个比较函数来自定义排序
arr.sort(function (x, y) {
    if (x < y) {
        return -1;
    }
    if (x > y) {
        return 1;
    }
    return 0;
});
console.log(arr); // [1, 2, 10, 20]

every()：

方法可以判断数组的所有元素是否满足测试条件

例：

var arr = ['Apple', 'pear', 'orange'];
console.log(arr.every(function (s) {
    return s.length > 0;
})); // true, 因为每个元素都满足s.length>0

console.log(arr.every(function (s) {
    return s.toLowerCase() === s;
})); // false, 因为不是每个元素都全部是小写

find():

用于查找符合条件的第一个元素，如果找到了，返回这个元素，否则，返回undefined

var arr = ['Apple', 'pear', 'orange'];
console.log(arr.find(function (s) {
    return s.toLowerCase() === s;
})); // 'pear', 因为pear全部是小写

console.log(arr.find(function (s) {
    return s.toUpperCase() === s;
})); // undefined, 因为没有全部是大写的元素

findIndex():

和find()类似，也是查找符合条件的第一个元素，不同之处在于findIndex()会返回这个元素的索引，如果没有找到，返回-1

var arr = ['Apple', 'pear', 'orange'];
console.log(arr.findIndex(function (s) {
    return s.toLowerCase() === s;
})); // 1, 因为'pear'的索引是1

console.log(arr.findIndex(function (s) {
    return s.toUpperCase() === s;
})); // -1

 

 

 

 

 

参考：https://www.liaoxuefeng.com/wiki/1022910821149312/1278025786193984