JavaScript call、apply、bind 详解前言 call、apply、bind是 JavaScript

前言

call、apply、bind是 JavaScript 中用来显式改变this的三个常用方法。它们既是开发中常见工具，也是面试高频考点。

有时候我们希望一个函数在执行时，this指向指定对象。

例如：

function say() {
  console.log(this.name);
}

const obj = {
  name: 'Tom'
};

如果直接调用：

say();

此时this不会指向obj。所以我们需要：

say.call(obj);

call会立即执行函数，并且第一个参数就是指定的this。

function say(age) {
  console.log(this.name, age);
}

const obj = { name: 'Tom' };

say.call(obj, 18); // Tom 18

apply和call类似，也会立即执行函数。区别在于参数形式不同：

function say(age, city) {
  console.log(this.name, age, city);
}

const obj = { name: 'Tom' };

say.apply(obj, [18, 'Beijing']); // Tom 18 Beijing

bind不会立即执行函数，而是返回一个新的函数，这个新函数的

this已经被绑定好了。

function say(age) {
  console.log(this.name, age);
}

const obj = { name: 'Tom' };

const fn = say.bind(obj, 18);
fn(); // Tom 18

const arrLike = { 0: 'a', 1: 'b', length: 2 };
const arr = Array.prototype.slice.call(arrLike);

console.log(arr); // ['a', 'b']

const obj = {
  name: 'Tom',
  say() {
    console.log(this.name);
  }
};

setTimeout(obj.say.bind(obj), 1000);

call、apply、bind的核心作用就是：

显式指定函数执行时的 this。

记忆口诀：