JS数组的几个高阶函数

JS数组的几个高阶函数

(1) Filter函数

const nums=[10,30,124,21,34,12]

找出小于100的数

Filter()的参数为一个函数，这个函数必须返回一个boolean值

为true时，函数内部会自动将这次回调的n加入到一个新的数组中。为false时，函数会过滤掉这次的n

Let newNums = Nums.filter(function(n){
    Retuen n<100  //每次遍历的n判断是否为true，为true加入新数组，为false则忽略此次结果
})
Console.log(“newNums”)//打印结果为[10,30,21,34]

(2) map函数

将上面获取到的数组全部乘以2

let new2Nums = newNums.map(function(n){
	return n*2  //遍历filter函数获取到的数组，再为每项做一个乘以2的操作，结果又返回一个新的数组
})
Console.log(“new2Nums”);//结果为[20,60,42,68]

(3) reduce函数

作用：对数组中的所有内容进行汇总（全部相乘或者相加之类的）

Reduce(参数1，参数2)：参数一为一个回调函数，参数二为一个初始值

Reduce(function(){},0)  //设置初始值为0

Let total = New2Nums.Reduce(function(preValue,n){  //回调函数里也有两个参数，第一个参数为上一次的值，第二个参数为该次循环数组里的值

Return preValue + n  //相当于把数组里的值依次相加

//第一次 preValue:0  n:20

//第二次 preValue:20  n:40

//第三次 preValue:60  n:42

//第四次 preValue:102  n:68

//最后一次 输出preValue 为 170

},0)

Console.log(‘total’)  //打印结果为170

所以，上面的所有代码可以合体成一行代码

Let total = nums.filter(function(n){

  Return n<100

}).map(function(n){

  Return n*2

}).reduce(function(preValue,n){

  Return preValue + n

},0)

 

Console.log(‘total’)  //打印结果依旧为170

然而 我们还能更加简洁，使用ES6的箭头函数，上面的代码可以简写为

Let total = nums.filter(n => n<100).map(n => n*2).reduce((pre,n) =>pre+n)

Console(‘tptal’) //打印结果依旧为170

其他一些方法

（4）find()函数

Find( )用于遍历数组，并返回第一个符合条件的元素，必须要传一个参数表示当前遍历的元素，例如

Shuzu.find( item => item.num === 1 )

遍历数组返回第一个num属性等于1的元素

（5）forEach()函数

forEach()函数用于调用数组中的每一个元素进行一些操作

用法是

Array . forEach( 要执行的回调函数 )

其中回调函数必须传一个参数，表示遍历的当前元素

例如：

Shuzu.forEach(item=>{ item.count += 1 })

对数组中的每个元素的count属性进行加一