数组的迭代方法map和reduce

map方法

map方法:返回一个新数组,新数组是在执行传入的函数(参数)后生成的新数组,并返回这个新数组。

map方法依据数组原始顺序一次遍历。

arr.map(function(curVal,index,arr),thisVal)

map参数:

  • 执行的函数function(curVal,index,arr),curVal当前遍历的值,index当前值的下标,arr当前数组.执行函数必选
  • thisVal,用于作为执行map函数内的this,this默认指代arr。可选
let arr = [1, 2, 3, 4];
arr.map(val=>{    //map会根据传入的函数对数组执行相关操作
val + 1
})

ES5实现map方法

Array.prototype.newMapF = function(func, thisVal){  //thisVal是自己指定的上下文对象
     let arr = Array.prototype.slice.call(this);  //this表示调用newMapF的数组对象,上下文,slice截取字符串返回,这里返回this指代的数组
   let newArr = [];
   for(let i =0, i < arr.length;i++){
      if(!arr.hasOwnProperty(i)){
      }else{
        //thisVal会劫持func函数执行,改变func的执行对象,是call方法的第一个参数,后面三个参数对应的是map第一参数function(curVal,index,arr)的三个参数
        //call和apply都是劫持,不同之处在于call传一个个参数,apply传数组,典型例子就是Math.max.apply(null,数组),因为max不支持传数组,
        //但是这里用call和apply劫持max方法执行,apply会将数组解析为一个个参数传入被劫持的方法。
        newArr.push(func.call(thisVal,arr[i],i,this))  
      }
    }
  return newArr;
}
arr.newMap(val=>{    
val + 1
})  //thisVal为空
 

 reduce方法

reduce方法与map方法类似,也是遍历数组执行传入的函数。

reduce(funcrtion(prev,cur,index,arr),initValue)

参数:

  • function(prev,cur,index,arr)
  • prev,初始值,数组遍历时,第一次执行function传入的prev,若没有初始值,默认prev是数组第一个元素,那么遍历从数组第二项开始。
  • cur,当前遍历的数组元素
  • index,当前遍历的数组元素下标
  • arr,当前数组
  • initValue,初始值,可选。
let arr = [1, 2, 3, 4];
arr.reduce((prev,val)=>{    
 return val + 1;        //return返回值是数组下一次遍历的prev
})
arr.reduce(function(prev,cur,index,arr){
console.log(prev,cur)    //第一次 1 2 第二次 3 3 第三次 6 4
  return prev + cur;    //返回的值在下一次遍历种作为prev传入  
})
arr.reduce(function(prev,cur,index,arr){
console.log(prev,cur)    //第一次 10 1 第二次 11 2 第三次 13 3 第四次 16 4
  return prev + cur;    //返回的值在下一次遍历种作为prev传入  
},10)

应用:

1.可以用来求数组的和

let arr = [1,3,5,6,8];
let sum = arr.reduce( function(prev,cur,index,arr){   return prev + cur;      })

ES5实现reduce方法

//func每次遍历执行的操作
//initValue初始值
Array.prototype.newReduce = function(func,initValue){
   let arr = Array.prototype.slice(this);
   let result,startIndex;
   //若没有初始值则设为第一个元素  
   result = initValue?initValue:arr[0];       
   startIndex =  initValue?0:1;
   for(let i = startIndex ; i<arr.length ; i++){
      result = func.call(null,result,arr[i],i,this)
   }  
   return result;
}
原文地址:https://www.cnblogs.com/hzozj/p/11697301.html