call、apply、bind的區(qū)別

1.定義：

call apply看作是對象的方法，通過調(diào)用方法的形式間接調(diào)用函數(shù)。都是為了改變某個(gè)函數(shù)運(yùn)行時(shí)的上下文（context）(函數(shù)體內(nèi)部 this 的指向)而存在的。

bind方法主要的作用是將函數(shù)綁定至某個(gè)對象，當(dāng)函數(shù)f()上調(diào)用bind()方法并傳入對象o作為參數(shù)，這個(gè)方法將返回一個(gè)新的函數(shù)。

2.參數(shù)：

【call、apply bind 相同點(diǎn)】：
第一個(gè)實(shí)參： 都是要調(diào)用函數(shù)的母對象，是調(diào)用的上下文。
第一個(gè)實(shí)參后的參數(shù)：是要傳入待調(diào)用函數(shù)的值
this的值：如果當(dāng)?shù)谝粋€(gè)參數(shù)為null、undefined的時(shí)候，默認(rèn)指向window，如果存在的話this的值指向第一個(gè)參數(shù)
【call、apply bind 不同點(diǎn)】：
第一個(gè)實(shí)參后的參數(shù)：apply實(shí)參放在數(shù)組中如：

f.call(o,1,2) 
f.apply(o, [1, 2]) //apply實(shí)參放在數(shù)組中

手寫bind函數(shù)

理解bind函數(shù)

bind方法主要的作用是將函數(shù)綁定至某個(gè)對象，當(dāng)函數(shù)f()上調(diào)用bind()方法并傳入對象o作為參數(shù)，這個(gè)方法將返回一個(gè)新的函數(shù)。

function f(y){return this.x+y} // step1.定義函數(shù)
var o={x:1} //step2.定義待傳入的對象
var g=f.bind(o)//step3.f函數(shù)綁定至o對象, 返回一個(gè)新對象賦值給g
g(2) //3

手寫bind函數(shù)

步驟：

1. 在Function原型上定義方法bind1
2. 將參數(shù)拆解為數(shù)組
3. 獲取this(數(shù)組第一項(xiàng))、及函數(shù)傳參
4. 獲取上下文(this):fn1.bind(...)中的fn1,存儲為self
5. 返回一個(gè)函數(shù)，函數(shù)內(nèi)用self.apply實(shí)現(xiàn)函數(shù)的綁定

代碼：

// step0:在Function原型上定義方法bind1
Function.prototype.bind1=function(){
    // arguments:可以獲取函數(shù)所有的參數(shù)
    console.log(arguments) //[{x: 100},10,20]
    // slice() 方法可從已有的數(shù)組中返回選定的元素。
    // step1:將參數(shù)拆解為數(shù)組
    
    const args = Array.prototype.slice.call(arguments)

    // step2:獲取this(數(shù)組第一項(xiàng))
    const this_ = args.shift() //shift() 方法用于把數(shù)組的第一個(gè)元素從其中刪除，并返回第一個(gè)元素的值。

    // 存儲 fn1.bind(...)中的fn1
    const self = this //this指向fn1

    //返回一個(gè)函數(shù)
    return function(){
        return self.apply(this_, args)
    }
}
const fn3 = fn1.bind1({
    x: 100
}, 10, 20)