模拟ES6的filter reduce map

最新推荐文章于 2022-07-16 15:33:07 发布

原创最新推荐文章于 2022-07-16 15:33:07 发布 · 222 阅读

0 ·

CC 4.0 BY-SA版权

本文详细介绍了如何使用原生JavaScript实现ES6中filter、map和reduce方法的模拟代码，通过具体示例展示了这些方法的工作原理和使用场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

/**
 * 模拟ES6的filter实现filter
 * @method fakeFilter
 * @param fn filter条件限定的回调函数
 * @returns {Array}
 */
Array.prototype.fakeFilter = function fakeFilter(fn) {
    if (typeof fn !== "function") {
        throw new TypeError(`${fn} is not a function`);
    }
    let temp = [];//临时数组 用于存放需要重构的数组元素
    //遍历所有元素
    for(let i=0,item;item=this[i++];){
        //将符合条件的元素存放至临时数组
        fn(item,i--,this)&&temp.push(item);
    }

    //将重构完毕的数组引用返回至外部
    return temp;
};

console.log([1,2,4].fakeFilter((item,index,arr)=>{
    return item>1
}));


/**
 * 模拟ES6的map实现map
 * @method fakeMap
 * @param fn 处理迭代元素的回调函数
 * @returns {Array}
 */
Array.prototype.fakeMap = function fakeMap(fn) {
    if (typeof fn !== "function") {
        throw new TypeError(`${fn} is not a function`);
    }

    let temp = [];//临时数组 用于存放需要重构的数组元素

    for(let i=0,item;item=this[i++];){
        //将当前元素放入回调函数处理
       temp.push(fn(item, i--, this));
    }

    return temp;
};

console.log(["a","b","c"].fakeMap((item,index,arr)=>{
    let tempObj={};
    tempObj[index+1]=item;
    return tempObj;
}));


/**
 * 模拟ES6的reduce实现reduce
 * @method fakeReduce
 * @param fn 累加函数
 * @param base 累加值
 * @returns {*}
 */
Array.prototype.fakeReduce = function fakeReduce(fn, base) {
    //遍历所有元素
    for(let i=0,item;item=this[i++];){
        //将当前元素和当前的累加值传入回调函数处理
        base=fn(base,item,i--,this);
    }
    //返回最终的累加结果
    return base;
};

let arr = [1, 2, 3];
let sum = arr.fakeReduce((prev, cur, index, arr) => {
    return prev + cur;
}, 1);
console.log(sum);

原文博客

https://blog.youkuaiyun.com/beijiyang999/article/details/80179097