数组的高阶函数使用方法

1、forEach()遍历

forEach() 方法用于调用数组的每个元素,并将元素传递给回调函数。(没有返回值,将数组遍历)

注意: forEach() 对于空数组是不会执行回调函数的。

回调函数参数:currentValue 必需。当前元素; index 可选。当前元素的索引值; arr 可选。当前元素所属的数组对象。

var array = ['a', 'b', 'c'];
   array.forEach(function(element) {
   console.log(element);
   });

2、filter()过滤返回

filter()方法创建一个新数组,其中所包含的元素是通过所提供函数对指定数组进行测试满足条件的所有元素

语法:

let newArray = arr.filter(callback(element[, index[, array]])[, thisArg])

返回值:一个新的,由通过函数检测的数组元素组成的数组,若没有符合条件的元素,则返回一个空数组。

特:当所过滤的数组是对象数组的情况时,对新返回的数组元素属性做出修改,同时对原数组也会造成影响;当过滤数组为纯数组时,修改不会改变原数组。

3、map()映射返回

map()方法也会返回一个空数组,新数组的元素是原数组调用方法处理后的产物。该方法会依照原数组的元素顺序依次处理元素。

var array = [65, 44, 12, 4];
console.log(array.map(function(item){
	return item * 100;
}))

注:map()方法不会对空数组进行检测;也不会改变原数组

4、some() 判断是否符合条件

some()方法用于检测数组中的元素是否满足指定条件;同map()方法一样会依次对原数组的元素进行检测。而且,只要有一个元素满足条件就会停止,并返回true,若原数组中没有符合条件的元素,则返回false。

同样的,some()也不会对空数组进行检测;不会改变原数组

var array = [65, 44, 12, 4];
console.log(array.some(function(item){
	return item > 100;
})) 
 //false

5、 every() 判断是否全部符合条件

every()方法用于检测数组的所有元素是否都符合给定条件,若有一个元素不符合,则整个表达式返回false,且接下来的操作也不再进行,若全部元素都符合条件,则返回true。every()也不会对空数组进行检测;不会改变原数组。

var array = [65, 44, 12, 4];
const aa = array.every(function(item){
	return item > 50;
}) 
const bb = array.every(function(item){
	return item < 80;
})
console.log(aa) // false
console.log(bb) //true

6、 reduce()累加

reduce()方法接收一个函数作为累加器。原数组中的每个值依次缩减,最终计算为一个值。该函数对于空数组是不会执行回调函数的。

let arr = [1, 2, 3, 4];
let sum = arr.reduce(function(prev, cur, index, arr) {
    console.log(prev, cur, index);
    return prev + cur;
})
console.log(arr, sum);

该方法常用来进行数组的累加或者乘积,计算数组中元素出现的次数,或者去除数组中重复的元素,数组对象属性累加。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
好的,我理解您的问题了。其实在ES5中的数组高阶函数本质上也是利用了原型的特性。不过在ES6中引入了箭头函数和更加简洁的语法,使得使用高阶函数更加方便。下面我将通过重构ES5中的数组高阶函数来展示如何利用原型的特性。 首先,我们来看一下ES5中的数组高阶函数的写法: ``` var arr = [1, 2, 3, 4, 5]; // map var newArr = arr.map(function(item) { return item * 2; }); // filter var filteredArr = arr.filter(function(item) { return item > 3; }); // reduce var reducedValue = arr.reduce(function(acc, item) { return acc + item; }, 0); ``` 现在我们来利用原型的特性,将这些高阶函数封装到数组的原型中: ``` Array.prototype.myMap = function(callback) { var newArr = []; for (var i = 0; i < this.length; i++) { newArr.push(callback(this[i], i, this)); } return newArr; }; Array.prototype.myFilter = function(callback) { var filteredArr = []; for (var i = 0; i < this.length; i++) { if (callback(this[i], i, this)) { filteredArr.push(this[i]); } } return filteredArr; }; Array.prototype.myReduce = function(callback, initValue) { var acc = initValue || this[0]; var startIndex = initValue ? 0 : 1; for (var i = startIndex; i < this.length; i++) { acc = callback(acc, this[i], i, this); } return acc; }; ``` 现在我们就可以像使用ES5中的数组方法一样来使用我们的自定义方法了: ``` var arr = [1, 2, 3, 4, 5]; // myMap var newArr = arr.myMap(function(item) { return item * 2; }); // myFilter var filteredArr = arr.myFilter(function(item) { return item > 3; }); // myReduce var reducedValue = arr.myReduce(function(acc, item) { return acc + item; }, 0); ``` 以上就是用原型的特性重构ES5中的数组高阶函数方法。希望可以帮助到您!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值