JavaScript apply、call和bind 方法的使用
阿新 • • 發佈:2018-11-14
首先,這三個方法都是改變函式的this物件的指向來擴充套件函式賴以執行的作用域。
- 每個函式都包含這三個非繼承而來的方法。
- 他們的用途相同,都是在特定的作用域中呼叫函式。
- 第一個引數都是this要指向的物件。
- 都可以傳遞引數,傳參方式不同。
- apply、call 返回函式執行結果, bind 會生成一個函式
- 傳參: apply(Obj, [ 引數1,引數2,… ]), call(Obj, 引數1,引數2,…),bind 在生成的函式執行處傳參。
> name = '李明'
'李明'
> age = 18
18
> let People = {name: '小紅' , age: 17}
undefined
> function sayHello(){
... console.log("Hello! " + this.name);
... }
undefined
> sayHello()
Hello! 李明
undefined
> sayHello.apply(People) // this指向 People物件
Hello! 小紅 // 直接返回執行結果
undefined
> sayHello.call(People); // this指向 People物件
Hello! 小紅 // 直接返回執行結果
undefined
> sayHello.bind(sayHello) // 返回一個新函式
[Function: bound sayHello]
> sayHello.bind(People)() // 可以在(引數)傳參
Hello! 小紅
undefined
> newSayHello = sayHello.bind(People)
[Function: bound sayHello]
> newSayHello()
Hello! 小紅
後來發現一段 Function.prototype.apply.call(fn, obj, args) 程式碼 ,,這什麼鬼……
看完上面知道要繫結一個函式的this物件,可以這樣寫:fn.apply(obj, args)
,但是如果函式自定義了apply方法,那麼要繫結一個函式的this物件只能寫成 Function.prototype.apply.call(fn, obj, args)
了。 簡化方法使用(ES6) :Reflect.apply