JS中操作数组的几个高阶函数

##filter()函数
作用:filter函数会将数组中的所有元素遍历后并过滤,并创建一个新数组,将满足条件的原数组元素添加到新数组中。
用法:filter函数接收一个回调函数作为参数,并且该回调函数必须返回一个Boolean类型的值,当返回为true时,函数内部会将这次遍历的元素添加到新数组中,当返回为false时,函数内部会过滤掉这次遍历的元素。
例子:定义一个数组用于求出下边数组中所有小于100的所以元素。numArray1 = [23,98,102,100,143,76,59,638,66,543]
1、使用普通的循环实现:

var numArray2 = new Array();
for(let i in numArray1){
	if(numArray1[i] > 100){
		numArray2.push(numArray1[i]);
	}
}
//打印结果
console.log(numArray2);

在了解了filter函数的用法之后,使用filter函数实现

let numArray2 = numArray1.filter(item => item > 100);
//打印结果
console.log(numArray2);	

##map()函数
作用:map函数会将数组中的每一个元素进行遍历,然后将数组中的每一个元素进行计算或者变化之后返回
举例说明其用法:对于上一步得到的数组numArray2,求出该数组中的所有元素的二次方,并存储在新数组中。
使用循环实现

let numArray3 = new Array();
for(let i in numAray2){
	numArray3.push(Math.pow(numArray2[i],2));
}
//打印结果
console.log(numArray3);

使用map函数实现。

let numArray3 = numArray2.map(item => Math.pow(item,2))
//打印结果
console.log(numArray3);

##reduce()函数
作用:reduce函数能将数组中的所有元素进行汇总,比如:将数组中的所有元素相加、相减、相乘、相除,并将运算结果返回。
用法:reduce函数接收一个回调函数和数字作为参数,数字代表初始化值。作为reduce函数参数的回调函数也有两个参数,第一个代表上一次的返回值,第二个参数是当前遍历的数组元素。
例子:将上一步得到的numArray3数组中的所有元素进行相加。
利用循环实现

let num = 0;
for(let i in numArray3){
	num += numArray3[i];
}
//打印结果
console.log(num);

##几个函数的链式运用
例子:求数组numArray1中所有小于100的元素,并计算这些元素的二次方,最后将所得结果进行相加。

let newNum = numAray1.filter(item => item < 100).map(item => Math.pow(item,2)).reduce((preValue,item) => preValue + item);

猜你喜欢

转载自blog.csdn.net/erhui193819671/article/details/107606009