Loading lesson path
method can be used to call a function with a specific this.
method lets an object use a method belonging to another object. In this way, the same method can be used on different objects. call() is an advanced topic. Make sure you understand this before continuing:
method is used to call a function with an object as an argument.
method takes this as the first argument.
Formula
Additional arguments are passed as a comma - separated list.Syntax functionName.call(
this, arg1, arg2, ...);When you use call(), you can decide what this should refer to. In the example below, the greet function returns a greeting + this.name. When you use call(), you decide that this should be the person3 object.
const person1 = { name: "John" };
const person2 = { name: "Paul" };
const person3 = { name: "Ringo" };
function greet(greeting) {
return greeting + " " + this.name;
}
greet.call(person3, "Hello");to borrow a method from another object:
Calls the fullName method of person, using it on person1
const person = {fullName
: function() {
return this.firstName + " " + this.lastName;
}
}
const person1 = {
firstName:"John", lastName: "Doe"
}
const person2 = {
firstName:"Mary", lastName: "Doe"
}
// This will return "John Doe":
person.fullName.call(person1
);Call the fullName method of person, using it on person2
const person = {fullName
: function() {
return this.firstName + " " + this.lastName;
}
}
const person1 = {
firstName:"John", lastName: "Doe"
}
const person2 = {
firstName:"Mary", lastName: "Doe"
}
// This will return "Mary Doe"
person.fullName.call(person2
);method can accept arguments. Arguments are passed normally, separated by commas:
const person = {
fullName: function(city, country) {
return this.firstName + " " + this.lastName
+ "," + city + "," + country;
}
}
const person1 = {
firstName:"John", lastName: "Doe"
}
person.fullName.call(person1, "Oslo", "Norway");
call() vs Normal Function Call
Compare a normal function call with a call()call.
Example function showName() {
return this.name;
}
const person = { name: "John" };
showName();
showName.call(person);
Without call(), this is not the person object.
With call(), this is set explicitly.
call() Does Not Create a New Functionmethod executes the function immediately.
It does not return a new function.Example function sayHello() {
return "Hello " + this.name;
}
const person = { name: "John" };
sayHello.call(person);
If you need a new function that remembers this, use bind()instead.
does not return a reusable function.requires arguments to be listed one by one.
for arrays.
Always know what this should refer to.
and a normal function call?