JS：call,apply,bind区别

bind

bind会创建一个新的函数，并将原始函数绑定到指定的上下文,以后可以进行复用。这意味着无论在什么时候调用这个新函数，它都会使用绑定的上下文。bind方法可以接收多个参数，第一个参数是要绑定的上下文对象，后面的参数是要传递给原始函数的参数。

语法

bind(thisArg)
bind(thisArg, arg1, arg2, /* …, */ argN)

示例

const info = { name: '张三' };

function Info(age) {
  console.log(`姓名: ${this.name}`);
  console.log(`年龄: ${age}`);
}

const bindInfo = Info.bind(info,'19');
bindInfo();  // 输出结果为:姓名: 张三
             //            年龄: 19 

call

call可以在指定的上下文中调用函数，并传递一个或多个参数。与bind不同的是，call会立即调用函数，而不是返回一个新函数，所以并不能像bind一样进行复用。call方法的第一个参数是要绑定的上下文对象，后面的参数是要传递给函数的参数。

call的第一个参数是更改后的this指向对象；如果第一个参数不填，在非严格模式下，指向的是全局；但是在严格模式下，指向的就是undefined了。

语法

call(thisArg)
call(thisArg, arg1, arg2, /* …, */ argN)

示例

const info = { name: '张三' };

function Info(age,sex) {
  console.log(`姓名: ${this.name}`);
  console.log(`年龄: ${age}`);
  console.log(`性别: ${sex}`);
}

Info.call(info,'19','男'); // 输出结果为:姓名: 张三
                           //            年龄: 19
                           //            性别: 男

apply

apply在指定的上下文中调用函数，并传递一个数组作为参数。与call类似，apply也是立即调用函数。第一个参数是要绑定的上下文对象，但与call不同的是，apply的第二个参数是一个数组这个数组里面包含要传递给函数的参数。

语法

apply(thisArg)
apply(thisArg, argsArray)

示例

const info = { name: '张三' };

function Info(age,sex) {
  console.log(`姓名: ${this.name}`);
  console.log(`年龄: ${age}`);
  console.log(`性别: ${sex}`);
}

Info.apply(info,['19','男']);// 输出结果为:姓名: 张三
                             //            年龄: 19
                             //            性别: 男

总结

• bind创建一个新函数并绑定上下文，以后可以调用。我们还可以通过bind来实现柯里化。
• call在指定的上下文中立即调用函数，并传入参数。
• apply在指定的上下文中立即调用函数，并传入数组作为参数。