手写javaScript原生方法------数组的迭代方法

90 阅读3分钟

数组的迭代方法共有5个,风别是forEach, every, some, map, filter; 它们的共同点是传入的参数是相同的(两个参数分别是回调函数以及执行的作用域对象),回调函数的参数也是相同的(三个参数依次是当前项,当前项索引,执行该方法的数组)。用法大家一定都不陌生,但具体怎样实现的大家是否真的熟悉呢?下面咱们 一 一 进行实现。重新实现的方法名为: my + 原方法名。

手写forEach方法

forEach用来遍历数组的每一项数据,这个功能跟for循环类似,但不同的是forEach不能跳出循环,也不能正常的终止循环。forEach方法也没有返回值。上代码:

Array.prototype.myForEach = function(callback) {
 //先类型判断一下
 if(typeof callback !== 'function') throw new Errow('type error');
 //_this指代的是函数运行的作用域对象默认为undefined
 let _this = arguments[1] ? arguments[1] : undefined;
 //所有的数组都可看做是通过new Array()方法创建的,即此时的this指向调用myForEach方法的数组
  let len = this.length;
  for(let i = 0; i < len; i++) {
    //调用call方法,依次传入当前项this[i],当前项的索引i,当前数组this
    callback.call(_this, this[i], i, this);
  }
}

手写every方法

every方法用来判断数组的每一项是否均符合判断条件,全都符合则返回true,否则返回false。 下面咱们实现一下every方法:

Array.prototype.myEvery = function(callback) {
    if(typeof callback !== 'function') throw new Errow('type error');
    let _this = arguments[1] ? arguments[1] : undefined;
    let len = this.length;
    let result;
    for(let i = 0; i < len; i++) {
        result = callback.call(_this, this[i], i, this);
        //当存在某一项不符合条件时跳出循环
        if(!result) break;
    }
    return result;
}

手写some方法

some方法用来判断数组中是否存在某一项符合条件,若存在返回true, 否则返回false。上面有了实现every方法的经验,那么some方法只需要把判断条件改一下就大功告成:

Array.prototype.mySome = function(callback) {
    if(typeof callback !== 'function') throw new Errow('type error');
    let _this = arguments[1] ? arguments[1] : undefined;
    let len = this.length;
    let result;
    for(let i = 0; i < len; i++) {
        result = callback.call(_this, this[i], i, this);
        //当存在某一项符合条件时跳出循环
        if(result) break;
    }
    return result;
}

手写map方法

map方法常用来对数组的每一项进行批量处理,返回处理后的数组。下面是实现功能的代码:

Array.prototype.mySome = function(callback) {
    if(typeof callback !== 'function') throw new Errow('type error');
    let _this = arguments[1] ? arguments[1] : undefined;
    let len = this.length;
    let result = [];
    for(let i = 0; i < len; i++) {
        //将处理后的每一项插入数组
        result.push(callback.call(_this, this[i], i, this));
    }
    return result;
}

手写filter方法

filter方法用来筛选数组中符合条件的项,并将它们组成新的数组返回。有了实现every以及map方法的经验,只需要将它俩结合一下就完成了:

Array.prototype.myFilter = function(callback) {
    if(typeof callback !== 'function') throw new Errow('type error');
    let _this = arguments[1] ? arguments[1] : undefined;
    let len = this.length;
    let result = [];
    let bool;
    for(let i = 0; i < len; i++) {
        bool = callback.call(_this, this[i], i, this);
        //只将判断通过的项插入数组
        bool && result.push(this[i]);
        //将处理后的每一项插入数组
    }
    return result;
}

虽然代码很简单,但学习是个循序渐进的过程,贵在日积跬步。 如有错误请jym指正。