Function.prototype.call()
BaselineWidely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Thecall()
method ofFunction
instances calls this function with a giventhis
value and arguments provided individually.
Try it
function Product(name, price) { this.name = name; this.price = price;}function Food(name, price) { Product.call(this, name, price); this.category = "food";}console.log(new Food("cheese", 5).name);// Expected output: "cheese"
Syntax
call(thisArg)call(thisArg, arg1)call(thisArg, arg1, arg2)call(thisArg, arg1, arg2, /* …, */ argN)
Parameters
thisArg
The value to use as
this
when callingfunc
. If the function is not instrict mode,null
andundefined
will be replaced with the global object, and primitive values will be converted to objects.arg1
, …,argN
OptionalArguments for the function.
Return value
The result of calling the function with the specifiedthis
value and arguments.
Description
Note:This function is almost identical toapply()
, except that the function arguments are passed tocall()
individually as a list, while forapply()
they are combined in one object, typically an array — for example,func.call(this, "eat", "bananas")
vs.func.apply(this, ["eat", "bananas"])
.
Normally, when calling a function, the value ofthis
inside the function is the object that the function was accessed on. Withcall()
, you can assign an arbitrary value asthis
when calling an existing function, without first attaching the function to the object as a property. This allows you to use methods of one object as generic utility functions.
Warning:Do not usecall()
to chain constructors (for example, to implement inheritance). This invokes the constructor function as a plain function, which meansnew.target
isundefined
, and classes throw an error because they can't be called withoutnew
. UseReflect.construct()
orextends
instead.
Examples
Using call() to invoke a function and specifying the this value
In the example below, when we callgreet
, the value ofthis
will be bound to objectobj
, even whengreet
is not a method ofobj
.
function greet() { console.log(this.animal, "typically sleep between", this.sleepDuration);}const obj = { animal: "cats", sleepDuration: "12 and 16 hours",};greet.call(obj); // cats typically sleep between 12 and 16 hours
Using call() to invoke a function without specifying the first argument
If the firstthisArg
parameter is omitted, it defaults toundefined
. In non-strict mode, thethis
value is then substituted withglobalThis
(which is akin to the global object).
globalThis.globProp = "foo";function display() { console.log(`globProp value is ${this.globProp}`);}display.call(); // Logs "globProp value is foo"
In strict mode, the value ofthis
is not substituted, so it stays asundefined
.
"use strict";globalThis.globProp = "foo";function display() { console.log(`globProp value is ${this.globProp}`);}display.call(); // throws TypeError: Cannot read the property of 'globProp' of undefined
Transforming methods to utility functions
call()
is almost equivalent to a normal function call, except thatthis
is passed as a normal parameter instead of as the value that the function was accessed on. This is similar to how general-purpose utility functions work: instead of callingarray.map(callback)
, you usemap(array, callback)
, which allows you to usemap
with array-like objects that are not arrays (for example,arguments
) without mutatingObject.prototype
.
TakeArray.prototype.slice()
, for example, which you want to use for converting an array-like object to a real array. You could create a shortcut like this:
const slice = Array.prototype.slice;// …slice.call(arguments);
Note that you can't saveslice.call
and call it as a plain function, because thecall()
method also reads itsthis
value, which is the function it should call. In this case, you can usebind()
to bind the value ofthis
forcall()
. In the following piece of code,slice()
is a bound version ofFunction.prototype.call()
, with thethis
value bound toArray.prototype.slice()
. This means that additionalcall()
calls can be eliminated:
// Same as "slice" in the previous exampleconst unboundSlice = Array.prototype.slice;const slice = Function.prototype.call.bind(unboundSlice);// …slice(arguments);
Specifications
Specification |
---|
ECMAScript® 2026 Language Specification # sec-function.prototype.call |