js 中call()与apply()区别与常见用途

在JS中Function原型定义了两个方法，分别是Function.prototype.call和Function.prototype.apply。

call与apply的区别

Function.prototype.call和Function.prototype.apply的作用是一样的，区别在于传入参数形式的不同。

1. apply接受两个参数，第一个参数指定了函数体内this对象的指向，第二个参数为一个带下标的集合，这个集合可以是数组，也可以是类数组，apply方法把这个集合中的元素作为参数传递给被调用的函数。

var foo=function(a,b,c){
    console.log([a,b,c]); //[1,2,3]
};
foo.apply(null,[1,2,3]);

2. call传入的参数数量不固定，跟apply相同的是，第一个参数也是代表函数体内this指向，从第二个参数开始往后，每个参数被依次传入函数。

var bar=function(a,b,c){
    console.log([a,b,c]); //[1,2,3]
};
bar.call(null,1,2,3);

当在使用call或apply时，如果传入的第一个参数是null，函数体内this会指向默认的宿主对象，在浏览器中则是window。但如果是在严格模式下，函数体内this还是为null。

 var func=function(a,b,c){
     console.log(this==window); //true
 };
 func.apply(null,[1,2,3]);

 var func=function(a,b,c){
     "use strict";
     console.log(this==window); //false
 };
  func.apply(null,[1,2,3]);

call和apply的用途

call和apply最常见的用途就是改变函数内部的this指向。
看下面代码：

 var obj1={
     name:'febby'
 };
 var obj2={
     name:'feifei'
 };
 window.name='BB';
 var getName=function(){
     console.log(this.name);
 };

 getName(); //BB
 getName.call(obj1); //febby
 getName.apply(obj2); //feifei

当执行getName.call(obj1);时， getName()函数体内的this就指向obj1对象。等价于

 var getName=function(){
     console.log(obj1.name); //febby
 };

以上便是call()与apply()区别与常见用途~
知识来源：JavaScript设计模式与开发实践