The call()
method calls a function with a given this
value and arguments provided individually.
Note: While the syntax of this function is almost identical to that of apply()
, the fundamental difference is that call()
accepts an argument list, while apply()
accepts a single array of arguments.
fun.call(thisArg[, arg1[, arg2[, ...]]])
thisArg
this
provided for the call to fun
. Note that this
may not be the actual value seen by the method: if the method is a function in non-strict mode code, null
and undefined
will be replaced with the global object and primitive values will be converted to objects.arg1, arg2, ...
The result of calling the function with the specified this
value and arguments.
A different this
object can be assigned when calling an existing function. this
refers to the current object, the calling object. With call
, you can write a method once and then inherit it in another object, without having to rewrite the method for the new object.
call
to chain constructors for an objectYou can use call
to chain constructors for an object, similar to Java. In the following example, the constructor for the Product
object is defined with two parameters, name
and price
. Two other functions Food
and Toy
invoke Product
passing this
and name
and price
. Product initializes the properties name
and price
, both specialized functions define the category
.
function Product(name, price) { this.name = name; this.price = price; if (price < 0) { throw RangeError('Cannot create product ' + this.name + ' with a negative price'); } } function Food(name, price) { Product.call(this, name, price); this.category = 'food'; } function Toy(name, price) { Product.call(this, name, price); this.category = 'toy'; } var cheese = new Food('feta', 5); var fun = new Toy('robot', 40);
call
to invoke an anonymous functionIn this purely constructed example, we create an anonymous function and use call
to invoke it on every object in an array. The main purpose of the anonymous function here is to add a print function to every object, which is able to print the right index of the object in the array. Passing the object as this
value was not strictly necessary, but is done for explanatory purpose.
var animals = [ { species: 'Lion', name: 'King' }, { species: 'Whale', name: 'Fail' } ]; for (var i = 0; i < animals.length; i++) { (function(i) { this.print = function() { console.log('#' + i + ' ' + this.species + ': ' + this.name); } this.print(); }).call(animals[i], i); }
call
to invoke a function and specifying the context for 'this'In below example, when we will call greet the value of this will be bound to object i.
function greet() { var reply = [this.person, 'Is An Awesome', this.role].join(' '); console.log(reply); } var i = { person: 'Douglas Crockford', role: 'Javascript Developer' }; greet.call(i); // Douglas Crockford Is An Awesome Javascript Developer
Specification | Status | Comment |
---|---|---|
ECMAScript 1st Edition (ECMA-262) | Standard | Initial definition. Implemented in JavaScript 1.3. |
ECMAScript 5.1 (ECMA-262) The definition of 'Function.prototype.call' in that specification. | Standard | |
ECMAScript 2015 (6th Edition, ECMA-262) The definition of 'Function.prototype.call' in that specification. | Standard | |
ECMAScript 2017 Draft (ECMA-262) The definition of 'Function.prototype.call' in that specification. | Draft |
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) |
© 2005–2017 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/call