js中map()的使用详解
原创
©著作权归作者所有:来自51CTO博客作者尔嵘bobo的原创作品,请联系作者获取转载授权,否则将追究法律责任
引入:
有网友有如下困惑:
map是数组的方法,有一个参数,参数是一个函数,函数中有3个参数
参数1:item必须。当前元素的值
参数2:index,可选。当前元素在数组中的索引值
参数3:arr可选。当前元素属于的数组对象
那这个作为map参数的函数是怎么被调用的呢
一、map()定义
在JavaScript的Array中,它返回一个新的数组,数组中的元素为原始数组调用函数处理后的值。
请注意:
map()不会对空数组进行检测
map()不会改变原数组
二、语法:
array.map(function(currentValue, index, arr), thisIndex)
参数详情:
function(currentValue, index, arr):必须。为一个函数,数组中的每个元素都会执行这个函数。其中函数参数:
currentValue:必须。当前元素的的值。
index:可选。当前元素的索引。
arr:可选。当前元素属于的数组对象。
thisIndex:可选。对象作为该执行回调时使用,传递给函数,用作"this"的值。
三、本案例中,按照感知理解:
返回一个由原数组每个元素乘以2后返回的新数组。
四、学习map()源码:
var arr = [1, 2, 3, 4, 5]
Array.prototype.myMap = function(fn){
var len = this.length;
var arr = [];
for(var i = 0; i < len; i ++){
arr.push(fn(this[i],i))
}
return arr;
}
var resultArrey = arr.myMap(function(item, index){
return item * 2;
})
console.log(resultArrey); //[2,4,6,8,10]