apply、call和bind对比

apply、call和bind对比

三者异同

1. 三者都是用来改变函数执行时的上下文，也就是改变this的指向。
2. call方法传递给调用函数的参数是逐个列出来的，而apply第二个以上的参数则要写在数组/类数组中，bind支持以上两种写法
3. call和apply直接执行了函数，而bind返回的是一个绑定上下文的函数，需要调用才会执行

三者用法

• apply的用法

  Function.apply(obj, [arg1, arg2....])
  

  立即执行

• call的用法

  Function.call(obj, arg1, arg2....)
  

  立即执行

• bind的用法

  // 支持以上两种写法
  Function.bind(obj, [arg1, arg2....])
  Function.bind(obj, arg1, arg2....)
  

  返回一个绑定上下文的函数，并且需要调用，才会执行

三种用法第一个参数都是是一个对象， 是Function 的调用者，将会指向这个对象。如果不传，则默认为全局对象 window

举个栗子

// call
const obj = {
  name: 'danae'
}
function sayHello(args) {
  console.log(this.name, args);
}
sayHello.call(obj, 'nice to meet you！')

// 输出: danae nice to meet you


// apply
const obj = {
  name: 'danae'
}
function sayHello(args) {
  console.log(this.name, args);
}
sayHello.apply(obj, ['nice to meet you！'])

//输出: danae nice to meet you！


// bind
const obj = {
  name: 'danae'
}
function sayHello(args) {
  console.log(this.name, args);
}
sayHello.bind(obj, 'nice to meet you！')()
// 或者
const sayHelloFunc = sayHello.bind(obj, 'nice to meet you！')
sayHelloFunc()
// 输出: danae nice to meet you！