使用Function.pr原型.apply()和Function.pr原型.call()调用函数有什么区别?

var func = function() {
  alert('hello!');
};

函数.apply();vs func.call();

上述两种方法之间是否存在性能差异?何时最好使用呼叫转移应用,反之亦然?


当前回答

调用、应用和绑定的另一个示例。Call和Apply之间的区别很明显,但Bind的工作原理如下:

Bind返回可以执行的函数的实例第一个参数是“this”第二个参数是逗号分隔的参数列表(如Call)

}

function Person(name) {
    this.name = name; 
}
Person.prototype.getName = function(a,b) { 
     return this.name + " " + a + " " + b; 
}

var reader = new Person('John Smith');

reader.getName = function() {
   // Apply and Call executes the function and returns value

   // Also notice the different ways of extracting 'getName' prototype
   var baseName = Object.getPrototypeOf(this).getName.apply(this,["is a", "boy"]);
   console.log("Apply: " + baseName);

   var baseName = Object.getPrototypeOf(reader).getName.call(this, "is a", "boy"); 
   console.log("Call: " + baseName);

   // Bind returns function which can be invoked
   var baseName = Person.prototype.getName.bind(this, "is a", "boy"); 
   console.log("Bind: " + baseName());
}

reader.getName();
/* Output
Apply: John Smith is a boy
Call: John Smith is a boy
Bind: John Smith is a boy
*/

其他回答

虽然这是一个老话题,但我只是想指出,.call比.apply稍快。我不能告诉你确切的原因。

参见jsPerf,http://jsperf.com/test-call-vs-apply/3


[更新!]

Douglas Crockford简要提到了两者之间的差异,这可能有助于解释性能差异。。。http://youtu.be/ya4UHuXNygM?t=15m52s

Apply接受一个参数数组,而Call接受零个或多个单独的参数!啊哈!

.apply(此,[…])

.调用(this,param1,param2,param3,param4…)

这里有一个小帖子,我在上面写道:

http://sizeableidea.com/call-versus-apply-javascript/

var obj1 = { which : "obj1" },
obj2 = { which : "obj2" };

function execute(arg1, arg2){
    console.log(this.which, arg1, arg2);
}

//using call
execute.call(obj1, "dan", "stanhope");
//output: obj1 dan stanhope

//using apply
execute.apply(obj2, ["dan", "stanhope"]);
//output: obj2 dan stanhope

//using old school
execute("dan", "stanhope");
//output: undefined "dan" "stanhope"

我们可以区分调用和应用方法,如下所示

CALL:单独提供参数的函数。若您知道要传递的参数或并没有要传递的变量,则可以使用call。

APPLY:调用以数组形式提供参数的函数。如果不知道要传递给函数的参数有多少,可以使用apply。

使用applyovercall有一个优点,我们不需要更改参数的数量,只需要更改传递的数组即可。

性能上没有太大差异。但我们可以说,调用比应用更快,因为数组需要在apply方法中求值。

要回答有关何时使用每个函数的问题,如果您不知道要传递的参数的数量,或者它们已经在数组或类似数组的对象中(例如arguments对象),请使用apply来转发您自己的参数。否则请使用call,因为不需要将参数包装在数组中。

f.call(thisObject, a, b, c); // Fixed number of arguments

f.apply(thisObject, arguments); // Forward this function's arguments

var args = [];
while (...) {
    args.push(some_value());
}
f.apply(thisObject, args); // Unknown number of arguments

当我不传递任何参数时(如您的示例),我更喜欢调用,因为我在调用函数。apply将暗示您正在将函数应用于(不存在的)参数。

应该不会有任何性能差异,除非您使用apply并将参数包装在数组中(例如f.apply(thisObject,[a,b,c])而不是f.call(thisObject,a,b,c))。我还没有测试过它,所以可能会有差异,但它会非常特定于浏览器。如果数组中没有参数,则调用可能会更快,如果有,则应用可能会更快。

从Function.pr原型.apply()上的MDN文档中:

apply()方法调用具有给定this值的函数作为数组(或类似数组的对象)提供的参数。语法fun.apply(thisArg,[argsArray])

从Function.pr原型.call()上的MDN文档中:

call()方法调用具有给定this值和单独提供的参数的函数。语法fun.call(thisArg[,arg1[,arg2[,…]]])

从JavaScript中的Function.apply和Function.call:

apply()方法与call()方法相同,只是apply(需要数组作为第二参数。数组表示的参数目标方法。


代码示例:

var doSomething=函数(){var arr=[];for(参数中的i){if(this〔arguments〔i〕〕的类型!==“undefined”){arr.push(this〔arguments〔i〕〕);}}返回arr;}var输出=函数(位置,对象){document.body.innerHTML+=“<h3>输出”+位置+“</h3>”+JSON.stringify(obj)+“\n<br>\n<br><hr>”;}输出(1,doSomething(“一”,“二”,“二”,“一”));输出(2,doSomething.apply({一:‘Steven’,二:‘Jane’}[“一”,“二”,“二”,“一”]));输出(3,doSomething.call({一:‘Steven’,二:‘Jane’},“一”,“二”,“二”,“一”));

另请参见此Fiddle。