使用reduce实现map

刚刚接触的时候觉得很简单的问题,但真正下手实现的时候,发现牵扯出很多的东西。你真的完全了解Array.prototype.map

map相关的概念

遍历数组的每一项,并执行回调函数的操作,返回一个对每一项进行操作后的新数组,

arr1.map(function(item,idx,arr){
    item //数组的每一项
    idx // 当前项的索引
    arr // 当前遍历的数组
    this // 函数体内的 this 为 callbackThis参数,
         // 如果不指定或者指定为 null和 undefined,则 this指向全局对象
},callbackThis)
reduce的相关概念

对数组累积执行回调函数,返回最终计算结果

array.reduce(function(total, currentValue, currentIndex, arr){
    total // 上一次循环体内返回的值
          // 如果指定 initialValue,则第一次循环的total为initialValue,    
          // 否则为array的第一个元素
    currentValue // 当前的元素
          // 如果指定 initialValue,则第一次循环的 currentValue 为 array的第一个元素,    
          // 否则为array的第二个元素
    currentIndex   //currentValue 的索引
    arr   // 当前遍历的数组
    
}, initialValue)
使用reduce模拟map
Array.prototype._map = function(fn, callbackThis) {
    // 最终返回的新数组
    let res = [];
    // 定义回调函数的执行环境
    // call第一个参数传入null,则 this指向全局对象,同 map的规则
    let CBThis = callbackThis || null;
    this.reduce((brfore, after, idx, arr) => {
        // 传入map回调函数拥有的参数
        // 把每一项的执行结果push进res中
        res.push(fn.call(CBThis, after, idx, arr));
    }, null);
    return res;
};
    原文作者:漓漾li
    原文地址: https://www.jianshu.com/p/e1c34c32def0
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞