Call()

call() 方法使用一个指定的 this 值和单独给出的一个或多个参数(function.call(thisArg, arg1, arg2, …))来调用一个函数。

function sayHello(name) {
     return 'hello ' + name;
}
function person(name, age) {
     console.log(sayHello.call(this, name) + ",I'm" + age + 'years old.');
}
person('uyoahz', 22)// hello uyoahz,I'm22years old.

person 中的 this 指 person 的函数作用域, 所以 sayHello 函数可以拿到 person 环境的变量。

call() 允许为不同的对象分配和调用属于一个对象的函数/方法。call() 提供新的 this 值给当前调用的函数/方法。

如果没有传递第一个参数,this 的值将会被绑定为全局对象。


Apply

apply() 方法调用一个具有给定this值的函数,以及以一个数组(类数组对象)的形式提供的参数。

apply 接受两个参数,第一个参数是 this 的指向,第二个参数是函数接受的参数,以数组的形式传入,且当第一个参数为 null、undefined 的时候,默认指向window

function sayHello(name) {
    return 'hello' + name;
}
function person(name, age) {
    console.log(sayHello.apply(this, [name]) + "I'm" + age + 'years old.');
}
person('uyoahz', 22)// hellouyoahzI'm22years old.

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


Bind

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

function sayHello(name) {
    return 'hello' + name;
}
function person(name, age) {
    var binFun = sayHello.bind(this, name);
    console.log(binFun() + "I'm" + age + 'years old.');
}
person('uyoahz', 22)// hellouyoahzI'm22years old.

调用 binFun 时sayHello函数调用 bind 方法,this 指向的是 当前的 person 的函数作用域, 所以能拿到 name 变量传递给 sayHello 函数。


apply,call,bind三者的区别

  • 三者都可以改变函数的 this 对象指向。
  • 三者第一个参数都是this要指向的对象,如果如果没有这个参数或参数为undefined或null,则默认指向全局window。
  • 三者都可以传参,但是apply是数组,而call是参数列表,且apply和call是一次性传入参数,而bind可以分为多次传入。
  • bind 是返回绑定 this 之后的函数,便于稍后调用;apply 、call 则是立即执行 。

UyoAhz