map
的实现原理
map
的实现是遍历数组中的每个元素,对每个元素执行回调函数,并将回调函数的结果存入一个新数组中
手写实现 map
javascript
//法一
Array.prototype.myMap = function(callback,thisArg) {
if(typeof callback !== 'function') {
throw new TypeError(callback + 'is not a function');
}
const result = [];
for (let i = 0; i < this.length; i++) {
if(this.hasOwnProperty(i)) {
result.push(callback.call(thisArg, this[i], i, this));
}
}
return result;
}
//法二
function myMap(arr, func) {
if (!Array.isArray(arr)) {
throw new TypeError('The first argument must be an array.');
}
if (typeof func !== 'function') {
throw new TypeError('The second argument must be a function.');
}
const result = [];
for (let i = 0; i < arr.length; i++) {
if (arr.hasOwnProperty(i)) { // 确保属性属于数组本身,而不是原型链上的
result.push(func(arr[i], i, arr)); // 将回调函数的结果添加到新数组
}
}
return result;
}
// 测试
const numbers = [1, 2, 3, 4];
const squaredNumbers = numbers.myMap((number) => number * number);
console.log(squaredNumbers); // 输出: [1, 4, 9, 16]
map
与其他数组方法的对比
forEach
:forEach
用于遍历数组,它不返回新数组。map
则返回一个新数组。filter
:filter
用于筛选数组元素,返回一个新数组。map
是对数组元素进行处理,返回一个新数组。reduce
:reduce
用于将数组元素归约为单个值,而map
是将数组元素映射为一个新数组。
map
的特点
- 不改变原数组:
map
不会修改原数组,而是返回一个新的数组。 - 返回值: 返回一个新的数组,数组中的每个元素是原数组元素经
callback
处理后的结果。 - 回调函数必须有返回值: 如果
callback
没有返回值,map
返回的新数组中对应的位置将会是undefined
。