? 函數內部中的 this 指向誰,不是在函數定義時決定的,而是在函數第一次調用并執行的時候決定的
1. call 方法
語法:函數名.call(調用者, 參數1, …)
作用:函數被借用時,會立即執行,并且函數體內的this會指向借用者或調用者
function fn(name, age) {
? ? this.name = name;
? ? this.age = age;
}
const obj = {}
// 經過call,this指向obj,obj開始有name、age屬性
fn.call(obj, '李四', 100)
// 以下this均指向window,name:undefined,age:undefined
fn.call()
fn.call(null)
fn.call(undefined)
結果:普通函數的this指向window,利用call方法將this指向了obj
2. apply方法
語法:函數名.apply(調用者, [參數, …])
作用:函數被借用時,會立即執行,并且函數體內的this會指向借用者或調用者
function fn(name, age) {
? ? this.name = name;
? ? this.age = age;
}
const obj = {}
// 經過apply,this指向obj,obj開始有name、age屬性
fn.apply(obj, ['李四', 100])
// 以下this均指向window,name:undefined,age:undefined
fn.apply()
fn.apply(null)
fn.apply(undefined)
結果:普通函數的this指向window,利用apply方法將this指向了obj
3. bind方法
語法:函數名.bind(調用者, 參數, …)
作用:函數被借用時,不會立即執行,而是返回一個新的函數。需要自己手動調用新的函數來改變this指向
function fn(name, age) {
? ? this.name = name;
? ? this.age = age;
}
const obj = {}
// const newFn = fn.bind(obj, '李四', 100)
// newFn()
fn.bind(obj, '李四', 100)()
結果:普通函數的this指向window,利用bind方法將this指向了obj
💤總結:
相同點: 三者都可以把一個函數應用到其他對象身上,注意不是自身對象
不同點:
○ call,apply是直接執行函數調用。bind是綁定,執行需要再次調用。
○ call,bind接收逗號分隔的無限個參數列表;apply接收數組作為參數。