應屆生都會的數組方法的源碼

forEach

• 做用: 循環遍歷數組
• 特色:
  • 不改變原數組，返回值爲undefined。
  • 改變不了數組的遍歷(return/break很差使，會報錯)
• 源碼實現

  Array.prototype.myForEach = function(func) {
    var len = this.length;
    for(var i = 0; i < len; i++) {
        func(this[i], i);
    }
  }
  複製代碼

filter

• 做用: filter篩選數組，篩選出新的數組。
• 特色: 篩選的值由return來決定，會放在一個新的數組中返回。
• 源碼實現

  Array.prototype.myFilter = function(func) {
    var len = this.length,
        newArr = [];
    for(var i = 0; i < len; i++) {
        if(func(this[i], i)) {
            newArr.push(this[i]);
        }
    }
    return newArr;
  }
  複製代碼

map

• map和filter的區別:
  • filter要的是ele
  • map要的是return出來的結果
• 特色:
• map處理return出來的值，把值放在一個新的數組，默認返回undefined。
• 淺拷貝，會改變原數組。
• 淺度map實現

  Array.prototype.myMap = function(func) {
      var len = this.length,
          newArr = [];
      for(var i = 0; i < len; i++) {
          newArr.push(func(this[i], i));
      }
      return newArr;
  }
  複製代碼

• 深度map實現

  // 深度克隆
  function deepClone(target, option) {
      if(option !== null) {
          for(var  prop in option) {
              var src = target[prop],
                  copy = option[prop];
              if(typeof(copy) === 'object') {
                  if(Object.prototype.toString(copy) === '[object Array]') {
                      src = [];
                  }else {
                      src = {};
                  }
                  target[prop] = deepClone(src, copy);
              }else {
                  target[prop] = copy;
              }
          }
      }   
      return target;
  }
  Array.prototype.myMap = function(func) {
      var len = this.length,
          newArr = [];
      for(var i = 0; i < len; i++) {
          if(this[i] && Object.prototype.toString.call(this[i]) === '[object Object]') {
              var newObj = {};
              deepClone(newObj, this[i]);
              newArr.push(func(newObj, i));
          }else if(this[i] && Object.prototype.toString.call(this[i]) === '[object Array]') {
              var Arr = [];
              deepClone(newArr, this[i]);
              newArr.push(func(Arr, i));
          }else {
              newArr.push(func(this[i], i));
          }
      }
      return newArr;
  }
  複製代碼

reduce

• 做用: 迭代數組，從左向右，累加器(效率高)。

• 源碼實現

  Array.prototype.myMap = function(func, init) {
    var k = 0,
        prev = init,
        len = this.length;
    if(init === undefined) {
        prev = this[0];
        k = 1;
    }
    for(k; k < len; k++) {
        prev = func(prev, this[k], k);
    }
    return prev;
  };
  複製代碼

  reduce

  • 特色: 相似reduce 從右向左
  • 源碼實現

    Array.prototype.myReduceRight = function(func, init) {
        var prev = init,
            len = this.length,
            k = len - 1; 
        if(init === undefined) {
            prev = this[k];
            k = len - 2;
        }
        for(k; k >= 0; k --) {
            prev = func(prev, this[k], k);
        }
        return prev;
    }
    複製代碼

  你的點贊是我持續輸出的動力 但願能幫助到你們 互相學習 有任何問題下面留言 必定回覆