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; }