重写ES6数组方法(forEach,filter,map,some,every,reduce)

概要

ES6新增的数组方法有 forEach, map , filter, every, some, reduce等,重写这些方法有助于理解js中语法糖的底层执行逻辑,扎实自己的js基础功底。重写ES6数组方法主要涉及到apply()函数的用法,每个函数都包含两个非继承而来的方法:call()方法和apply()方法,call和apply可以用来重新定义函数的执行环境,也就是this的指向。

重写forEach

Array.prototype.myForEach = function (func) {
  var _arr = this;
  var _len = _arr.length;
  var arg2 = arguments[1] || window;

  for (var i=0; i < _len; i++) {
    func.apply(arg2, [_arr[i], i, _arr]);
  }
}

重写filter

Array.prototype.myFilter = function (func) {
  var _arr = this;
  var _len = _arr.length;
  var _arg2 = arguments[1] || window;
  var _item;
  var newArray = [];

  for (var i = 0; i < _len; i++) {
    _item = deepClone(_arr[i]);
    func.apply(_arg2, [_item, i, _arr]) ? newArray.push(_item) : '';
  }
  return newArray;
}

重写map

Array.prototype.myMap = function (func) {
  var _arr = this;
  var _len = _arr.length;
  var _arg2 = arguments[1] || window;
  var _item;
  var newArray = [];
  for (var i = 0; i < _len; i++) {
    _item = deepClone(_arr[i]);
    newArray.push(func.apply(_arg2, [_item, i, _arr]));
  }
  
  return newArray;
}

重写some

Array.prototype.mySome = function (func) {
  var _arr = this;
  var _len = _arr.length;
  var _arg2 = arguments[1] || window;
  var result = false;
  for (var i = 0; i < _len; i++) {
    if (func.apply(_arg2, [_arr[i], i, _arr])) {
      result = true;
      break;
    }
  }
  
  return result;
}

重写every

Array.prototype.myEvery = function (func) {
  var _arr = this;
  var _len = _arr.length;
  var _arg2 = arguments[1] || window;
  var result = true;
  for (var i = 0; i < _len; i++) {
    if (!func.apply(_arg2, [_arr[i], i, _arr])) {
      result = false;
      break;
    }
  }
  
  return result;
}

重写reduce

Array.prototype.myReduce = function (func, initialValue) {
  var _arr = this;
  var _len = _arr.length;
  var _arg3 = arguments[2] || window;
  var _item;
  for (var i = 0; i < _len; i++) {
    _item = deepClone(_arr[i]);
    initialValue = func.apply(_arg3, [initialValue, _item, i, _arr]);
  }
  
  return initialValue;
posted @ 2021-07-20 20:30  Elwin0204  阅读(212)  评论(0编辑  收藏  举报