js实现call，apply，bind方法

js手写call，apply，bind方法

• call方法

Function.prototype.myCall = function(thisArg, ...args) {
    var fn = this

    // 对thisArg转成对象类型(防止它传入的是非对象类型)
    thisArg = (thisArg !== null && thisArg !== undefined) ? Object(thisArg) : window

	//调用需要被执行的函数
    thisArg.fn = fn
    var result = thisArg.fn(...args)
    delete thisArg.fn

	// 将最终的结果返回出去
    return result
}

function foo() {
    console.log('foo调用', this)
}

function sum(num1, num2) {
    console.log('sum调用', this)
    return num1 + num2
}

//系统调用
// foo.call() /foo对象
// sum.call() /sum对象

//我的call
foo.myCall('abc')
var sumData = sum.myCall('sum', 10, 20)
console.log(sumData) //'sum' , 30

//edge case
foo.myCall(0)

• apply方法

Function.prototype.myApply = function(thisArg, argArray) {
    var fn = this

    // 对thisArg转成对象类型(防止它传入的是非对象类型)
    thisArg = (thisArg !== null && thisArg !== undefined) ? Object(thisArg) : window
    thisArg.fn = fn

    // argArray = argArray ? argArray : []
    argArray = argArray || []

    var result = thisArg.fn(...argArray)
    delete thisArg.fn

    return result
}

function sum(num1, num2) {
    return num1 + num2
}
function foo() {
    console.log('foo')
}

var result2 = sum.myApply('abc', [20, 30])
console.log(result2) //'abc', 50

foo.myApply('abc')

• bind方法

Function.prototype.myBind = function(thisArg,...argArray) {
    var fn = this

    thisArg = (thisArg !== null && thisArg !== undefined) ? Object(thisArg) : window

    function proxyFn(...args) {
        thisArg.fn = fn
        var finalArgs = [...argArray, ...args] //处理参数 拼接，也可以用argArray.contact(...args)
        var result = thisArg.fn(...finalArgs)
        delete thisArg.fn
        return result
    }

    return proxyFn
}

function sum(num1, num2, num3, num4) {
    var sum = num1 + num2 + num3 + num4
    console.log(num1, num2, num3, num4)
    return sum
}

var newSum = sum.myBind('abc', 10, 20)
var result = newSum(30, 40)
console.log(result)
 // 10,20,30,40 
 // 100