JavaScript 中 apply()、call()、bind() 的用法以及区别

一、作用

apply、call、bind、作用都是改变函数执行时的上下文,也就是改变函数运行时this的指向。

var content = {
  name: 'my name'
}
var name = 'helx';
var obj = {
  name: '你的名字',
  sayName: function (...args) {
    console.log('name:', this.name);
    console.log('args:', args);
  }
}
obj.sayName('a', 'b', 'c'); // name: 你的名字   args: ['a', 'b', 'c']

var func = obj.sayName;  // 将obj.sayName函数赋值给func
func(); // name: helx args: [] func执行时this指向了全局，name也就是全局的

二、区别

1.apply接收两个参数，第一个是this的指向，第二个参数是函数接收的参数，以数组的形式。改变this后会立即执行，且此方法临时改变this一次

var func = obj.sayName;
func.apply(content, ['a', 'p', 'p', 'l', 'y',]);// 通过apply改变func执行时的this,这里指向content, 输出 name: my name  args: ['a', 'p', 'p', 'l', 'y']

2.call第一个参数是this的指向，第二个参数至第n个参数以逗号分隔，类似apply第二个参数数组平铺开来。 和apply类似改变this后会立即执行，且此方法临时改变this一次。

var  func = obj.sayName;
func.call(content, 'c', 'a', 'l', 'l' ); // name: my name args  ['c', 'a', 'l', 'l']

3.bind方法和call很相似，第一参数也是this的指向，后面传入的也是一个参数列表(但是这个参数列表可以分多次传入),改变this后不会立即执行，而是返回一个永久改变this的函数。

var bindObj = {
  name: 'lbj'
}
var func = obj.sayName;
var b1 = func.bind(content, 'b', 'i', 'n', 'd');
var b2 = func.bind(bindObj, 'b', 'i', 'n', 'd');
b1(); // name: my name args: ['b', 'i', 'n', 'd']
b1(); //再次执行b1 name: my name args: ['b', 'i', 'n', 'd']
b2(); // name: lbj args: ['b', 'i', 'n', 'd']

总结：
apply、call、bind方法的第一个参数都是this的指向,
1.apply和call的区别在, apply是数组, call是个列表
2.call和bind他们传参都相同,区别在于bind是永久绑定this,返回一个绑定作用域的函数，但是不会立即执行(例如b1、b2), call会立即执行。