技術標籤：JavaScriptjavascriptmap

Array.prototype.my_map = function(fn, context) {

    let resArr = []
    const me = this

    const ctx = context ? context : me // 定義上下文

    if (typeof fn !== 'function') {
        throw new Error(`${fn} is not a function`)
    }

    me.forEach((item, index) => {
 

        resArr.push(fn.call(ctx, item, index, me)) // 將回調結果放入陣列中
    })

    return resArr // 返回map後的陣列
}

下面來驗證一下

const arr = [1,2,3]

const newArr = arr.my_map(function(item, index, _arr) {
    console.log(this, item, index, _arr)
    return item * 2
}, arr1)

console.log(newArr)

可以看到還是比較成功的，再來驗證一下上下文有沒有繫結成功

const arr = [1,2,3]
const arr1 = [4,5,6]

const newArr = arr.my_map(function(item, index, _arr) {
    console.log(this, item, index, _arr)
    return item * 2
}, arr1)

console.log(newArr)

再看一下錯誤處理

const arr = [1,2,3]
const arr1 = [4,5,6]

const newArr = arr.my_map(123, arr1)

console.log(newArr)
 

ok!大功告成了