数组map方法与如何使用ES5实现
数组map方法与如何使用ES5实现
JavaScript Array map() 方法
定义
map()
方法返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。
map()
方法按照原始数组元素顺序依次处理元素。
注意:
map()
不会检测数组是否为空。map()
不会改变原始数组,而是返回一个新数组。
语法
arr.map(function(curVal,idx,arr), thisVal)
参数 | 描述 |
---|---|
curVal | 必须,当前元素的值。 |
Idx | 可选,当前元素的索引值。 |
arr | 可选,当前元素属于的数组对象。 |
thisVal | 可选,传递给函数,用作this 的值。 |
例子
let arr = [1,2,3,4,5];
arr.map(val => val+1); // [2,3,4,5,6]
使用ES5实现map()函数
Array.prototype.myMap = function(fn, ctx) {
let oriArr = Array.prototype.slice.call(this);
let mappedArr = [];
for (let i = 0; i < oriArr.length; i++) {
if (!oriArr.hasOwnProperty(i)) {
// 若原数组为稀疏数组,不含索引为i的元素时,mappedArr直接增加length,来达到同样的稀疏效果
mappedArr.length++;
} else {
mappedArr.push(fn.call(ctx, oriArr[i], i, this));
}
}
return mappedArr;
};
检测:
let a = [1,2,3,,,,4,];
a.map(val => val+1); // (8) [2, 3, 4, empty × 3, 5, empty]
a.myMap(val => val+1); // (8) [2, 3, 4, empty × 3, 5, empty]