this显式绑定

call()、apply()、bind()

显式绑定：使用call()、apply()、bind()方法将this进行强制绑定（硬绑定）。

call()的语法和作用与 apply()方法只有一个区别，就是 call() 方法接受的是一个参数列表，而 apply() 方法接受的是一个包含多个参数的数组。

call()

使用call()方法会直接调用函数

function.call(this指向, 参数1, 参数2, ...)

this指向：可选，用于修改函数this指向，非严格模式下，指定null、undefined会自动指向全局window

参数1, 参数2, ...

传递给函数的实参

apply()

使用apply()方法会直接调用函数

function.apply(this指向, [参数1, 参数2, ...])

this指向：第一个参数用于修改函数this指向

[参数1, 参数2, ...]：一个数组或者类数组对象，其中的数组元素将作为单独的参数传给function函数。

Function.prototype.call() – JavaScript | MDN

Function.prototype.apply() – JavaScript | MDN

bind()

使用bind()方法不会不会不会直接调用函数

返回值

一个新函数

bind() 方法创建一个新的函数，在 bind() 被调用时，这个新函数的 this 被指定为 bind() 的第一个参数，而其余参数将作为新函数的参数，供调用时使用。

function.bind(this指向, 参数1, 参数2, ...)

例：

bf是bind创建出来的函数，bf函数内的this指向己经被强硬指向了bind的参数obj（即对象{name:'liao'}）

function fn() {
    console.log(this)
}

let obj = {    name:'liao'}

let bf = fn.bind(obj) 

bf() 

//{name: 'liao'}

一个小坑

bind方法返回的新函数和原函数长得一样，但是内存地址不一样

function fn(){}

let fn2 = fn.bind({}) //fn2是新函数，和fn内存地址不一样

console.log(fn == fn2) //false

总结

1. call() apply() bind() 都可以替换修改函数this的指向
2. call() 和 apply() 会立马调用函数, call()参数需要一个个的传, apply()传参必须是数组形式
3. bind() 会得到一个新函数, 这个函数绑定死了 this 指向

Function.prototype.bind() – JavaScript | MDN