call、apply、bind 的用法

call、apply、bind 最主要的作用就是改变this的指向。

这章笔记的重点不是this，所以就简单解释一下this，不多做赘述。

this代表当前this直属的函数所属的对象。

let obj = {
  fn(a, b) {
    console.log(this)
  }
}
obj.fn(1, 2)

在上面的代码中，this直属的函数是fn()，fn()所属的对象是obj。
所以就算用默认方式调用，函数中的this 也指向对象obj 。

call、apply、bind 的用法

call、apply、bind 里面第一个参数传什么，函数里面的this就是什么。

let obj = {name: '釉纸糖'}
function sayName(){
  console.log(this.name)
}
sayName.call(obj)
sayName.apply(obj)
let fn = sayName.bind(obj)
fn()

既然 call、apply、bind 的用法差不多，为什么不以 a、b、c 的顺序排列，这样不是看起来更加顺眼嘛。
而且，等等，bind 是怎么回事，它怎么和其他两个不一样啊！

call、apply、bind 的区别

call、apply

call、apply 被放在一起说的原因主要是因为他们太太太太太像了。
就连MDN都在最上面写了注意。

注意：call()方法的作用和 apply() 方法类似，区别就是call()方法接受的是参数列表，而apply()方法接受的是一个参数数组。

obj.fn.call(obj, 1, 2)         // this 是 obj
obj.fn.apply(obj, [1, 2])

• call除了第一个参数可以指定this之外，其他和默认方式几乎没有区别。
• 而apply 使用参数数组，如 fun.apply(this, ['eat', 'bananas'])，或数组对象， 如 fun.apply(this, new Array('eat', 'bananas'))。

  bind

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

  obj.fn.bind(obj)(1, 2)

bind() 最简单的用法是创建一个函数，不论怎么调用，这个函数都有同样的 this 值。JavaScript新手经常犯的一个错误是将一个方法从对象中拿出来，然后再调用，期望方法中的 this 是原来的对象（比如在回调中传入这个方法）。如果不做特殊处理的话，一般会丢失原来的对象。基于这个函数，用原始的对象创建一个绑定函数，巧妙地解决了这个问题：

this.x = 9;    // 在浏览器中，this 指向全局的 "window" 对象
var module = {
  x: 81,
  getX: function() { return this.x; }
};
module.getX(); // 81
var retrieveX = module.getX;
retrieveX();   
// 返回 9 - 因为函数是在全局作用域中调用的
// 创建一个新函数，把 'this' 绑定到 module 对象
// 新手可能会将全局变量 x 与 module 的属性 x 混淆
var boundGetX = retrieveX.bind(module);
boundGetX(); // 81