手寫實現一個forEach方法和用reduce實現map

實現一個forEach方法

forEach()方法對數組的每一個元素執行一次給定的函數。

arr.forEach(function(currentValue, currentIndex, arr) {}, thisArg)

//currentValue  必需。當前元素
//currentIndex  可選。當前元素的索引
//arr           可選。當前元素所屬的數組對象。
//thisArg       可選參數。當執行回調函數時，用做 this 的值。

Array.prototype._forEach = function(fn, thisArg) {
    if (typeof fn !== 'function') throw "參數必須爲函數";
    if(!Array.isArray(this)) throw "只能對數組使用forEach方法";
    let arr = this;
    for(let i=0; i<arr.length; i++) {
        fn.call(thisArg, arr[i], i, arr)
    }
}

// test
let arr = [1,2,3,4,5];
arr._forEach((item, index) => {
    console.log(item, index);
})

// test thisArg

function Counter() {
    this.sum = 0;
    this.count = 0;
}
// 由於 thisArg 參數（this）傳給了 forEach()，每次調用時，它都被傳給 callback 函數，做爲它的 this 值。
Counter.prototype.add = function (array) {
    array._forEach(function (entry) {
        this.sum += entry;
        ++this.count;
    }, this);
      // ^---- Note
};

const obj = new Counter();
obj.add([2, 5, 9]);

console.log(obj.count); // 3 === (1 + 1 + 1)
console.log(obj.sum);  // 16 === (2 + 5 + 9)

用reduce實現map

reduce是一個累加方法，是對數組累積執行回調函數，返回最終計算結果。

array.reduce(function(total, currentValue, currentIndex, arr){}, initialValue);

//total 必需。初始值, 或者計算結束後的返回值。
//currentValue  必需。當前元素
//currentIndex  可選。當前元素的索引
//arr   可選。當前元素所屬的數組對象。
//initialValue可選。傳遞給函數的初始值

map是遍歷數組的每一項，並執行回調函數的操做，返回一個對每一項進行操做後的新數組。

array.map(function(currentValue,index,arr), thisArg)；
//currentValue  必須。當前元素的值
//index 可選。當前元素的索引值
//arr   可選。當前元素屬於的數組對象
//thisArg 可選。對象做爲該執行回調時使用，傳遞給函數，用做 "this" 的值。若是省略了 thisArg，或者傳入 null、undefined，那麼回調函數的 this 爲全局對象。

用reduce實現map方法

Array.prototype.myMap = function(fn, thisArg){
    var res = [];
    thisArg = thisArg || [];
    this.reduce(function(pre, cur, index, arr){
      res.push(fn.call(thisArg, cur, index, arr));
  }, []);
  return res;
}
var arr = [2,3,1,5];
arr.myMap(function(item,index,arr){
    console.log(item,index,arr);
})
let res = arr.myMap(v => v * 2);
console.log(res); // [4,6,2,10]