本系列面试题旨在学会相关知识点，从而轻松应对面试题的各种形式，本文讲解了 JavaScript 中的一些 高阶函数，包括参数和返回值等。
什么是高阶函数?
高阶函数是对其他函数进行操作的函数，可以将它们作为参数或返回它们。
简单来说，高阶函数是一个函数，它接收函数作为参数或将函数作为输出返回。
1.函数可以作为参数
function bar(fn){
if(typeof fn === "function"){
fn()
}
}
//调用
bar(function () {})
复制代码2. 函数可以作为返回值
function bar(){
return function (){}
}
//调用
const fn = bar ()
console.log(fn)
复制代码JS中的高阶函数
1.map
传递给 map() 方法的回调函数接受 3 个参数：currentValue，index 和 array。
currentValue：必须。当前元素的的值。index：可选。当前元素的索引。arr：可选。当前元素属于的数组对象。
有这样一个数组 [10,20,45,50,65,150,70,40] 现在有如下需求
把数组中所有的元素 * 2。
let arr = [10, 20, 45, 50, 65, 150, 70, 40];
let newArr = arr.map((item) => {
return item * 2;
});
console.log(newArr)// [20, 40, 90, 100, 130, 300, 140, 80]
复制代码2.filter
传递给 filter() 方法的回调函数接受 3 个参数：currentValue，index 和 array。
currentValue：必须。当前元素的的值。index：可选。当前元素的索引。arr：可选。当前元素属于的数组对象。
有这样一个数组 [20, 40, 90, 100, 130, 300, 140, 80] 现在有如下需求
返回数组中所有小于 100 的元素。
let arr = [20, 40, 90, 100, 130, 300, 140, 80];
let newArr = arr.filter((item) => {
return item < 100;
});
console.log(newArr);//[20, 40, 90, 80]
复制代码3.forEach
forEach()方法类似于map()，传入的函数不需要返回值,并将元素传递给回调函数。forEach()对于空数组是不会执行回调函数的。forEach()不会返回新的数组,总是返回undefined.
传递给 forEach() 方法的回调函数接受 3 个参数：currentValue，index 和 array。
currentValue：必须。当前元素的的值。index：可选。当前元素的索引。arr：可选。当前元素属于的数组对象。
有这样一个数组 [20, 40, 90, 100] 现在有如下需求。
分别打印数组中的元素及其索引。
let arr = [20, 40, 90, 100];
let newArr = arr.forEach((item,index) => {
console.log(item,index);
});
//20 0
//40 1
//90 2
//100 3
复制代码4.sort
sort() 方法接受一个可选参数,用来规定排序顺序,必须是函数。
如果没有传递参数, sort() 方法默认把所有元素先转换为 String 再排序 ,根据 ASCII 码进行排序。
如果想按照其他标准进行排序，就需要提供比较函数，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下：
有这样一个数组 [10, 20, 1, 2] 现在有如下需求
按从小到大排序。
let arr = [10, 20, 1, 2];
arr.sort(function (x, y) {
if (x < y) {
return -1;
}
if (x > y) {
return 1;
}
return 0;
});
console.log(arr); // [1, 2, 10, 20]
复制代码按从大到小排序
let arr = [10, 20, 1, 2];
arr.sort(function (x, y) {
if (x < y) {
return 1;
}
if (x > y) {
return -1;
}
return 0;
}); // [20, 10, 2, 1]
复制代码5.some
some()方法用于检测数组中的元素是否满足指定条件。some()方法会依次执行数组的每个元素。- 如果有一个元素满足条件，则表达式返回
true, 剩余的元素不会再执行检测。 - 如果没有满足条件的元素，则返回
false。 some()不会对空数组进行检测。some()不会改变原始数组。
传递给 some() 方法的回调函数接受 3 个参数：currentValue，index 和 array。
currentValue：必须。当前元素的的值。index：可选。当前元素的索引。arr：可选。当前元素属于的数组对象。
有这样一个数组 [10, 20, 1, 2] 现在有如下需求。
判断数组中是否含有大于 10 的数字。
let arr = [10, 20, 1, 2];
let result = arr.some((item) => {
return item > 10;
});
console.log(result);//true
复制代码6.every
every()方法用于检测数组所有元素是否都符合指定条件。every()方法会依次执行数组的每个元素。- 如果数组中检测到有一个元素不满足，则整个表达式返回
false，且剩余的元素不会再进行检测。 - 如果所有元素都满足条件，则返回
true。 every()不会对空数组进行检测。every()不会改变原始数组。
传递给 every() 方法的回调函数接受 3 个参数：currentValue，index 和 array。
currentValue：必须。当前元素的的值。index：可选。当前元素的索引。arr：可选。当前元素属于的数组对象。
有这样一个数组 [11, 20, 51, 82] 现在有如下需求。
判断数组中是否所有的数字都大于 10。
let arr = [11, 20, 51, 82];
let result = arr.every((item) => {
return item > 10;
});
console.log(result);//true
复制代码7.reduce
reduce 方法接收两个参数
传递给 reduce() 方法的回调函数接受 4 个参数：prev, current, currentIndex, arr。
prev：必须。函数传进来的初始值或上一次回调的返回值。current：必须。数组中当前处理的元素值。currentIndex：可选。当前元素索引。arr：可选。当前元素所属的数组本身。
有这样一个数组[1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 现在有如下需求
返回数组所有元素累加之和
let arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let sum = arr.reduce((prev, current) => {
return prev + current;
}, 0);
console.log(sum); //55
复制代码8.reduceRight
reduceRight() 方法的功能和 reduce() 功能是一样的，不同的是 reduceRight() 从数组的末尾向前将数组中的数组项做累加。
9.find
传递给 find() 方法的回调函数接受 3 个参数：currentValue，index 和 array。
currentValue：必须。当前元素的的值。index：可选。当前元素的索引。arr：可选。当前元素属于的数组对象。
有这样一个数组 [11, 20, 51, 82] 现在有如下需求
返回数组中第一个大于50的元素
let arr = [11, 20, 51, 82];
let result = arr.find((item) => {
return item > 50;
}, 0);
console.log(result);//51
复制代码10.findindex
findindex() 和 find() 类似，也是查找符合条件的第一个元素，不同之处在于 findindex() 会返回这个元素的索引，如果没有找到，返回 -1 。
有这样一个数组 [11, 20, 51, 82] 现在有如下需求。
返回数组中第一个大于 50 的元素索引。
let arr = [11, 20, 51, 82];
let result = arr.findindex((item) => {
return item > 50;
}, 0);
console.log(result);// 2
复制代码链式调用高阶函数
假如有一个数组 [10, 20, 45, 50, 65, 150, 70, 40]
需求一:给数组中的每个元素 * 2
我们使用的是 map() ,得到了[20, 40, 90, 100, 130, 300, 140, 80]
需求二:返回需求一中得到的新数组所有小于 100 的元素
我们使用的是filter() , 得到了[20, 40, 90, 80]
需求三:计算需求二中得到的新数组所有元素之和
我们使用的是reduce(),得到了 230
let arr = [10, 20, 45, 50, 65, 150, 70, 40];
let total = arr.map(n => n * 2).filter(n => n < 100).reduce((pre, n) => pre + n);
console.log(total);//230
复制代码版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
