JavaScript call() Method: It calls the method, taking the owner object as an argument. The keyword this refers to the ‘owner’ of the function or the object it belongs to. We can call a method that can be used on different objects.
Syntax:
object.objectMethod.call( objectInstance, arguments )
JavaScript apply() Method: The apply() method is used to write methods, which can be used on different objects. It is different from the function call() because it takes arguments as an array.
Syntax:
object.objectMethod.apply(objectInstance, arrayOfArguments)
Difference between the call() and apply() methods: The only difference is call() method takes the arguments separated by a comma while apply() method takes the array of arguments.
Example 1: This example uses the call() method to call a function.
html
<body style="text-align:center;"> <h1 style="color:green;"> GeeksForGeeks </h1> <h3>call() method</h3> <button onClick="fun()"> click </button> <p id="GFG"></p> <!-- Script to use call() method to call function --> <script> function fun() { let p = { fullName: function(addr1, addr2) { return this.fName + " " + this.lName + ", " + addr1 + ", " + addr2; } } let p1 = { fName:"GFGfName", lName: "GFGlName", } let x = p.fullName.call(p1, "India", "USA"); document.getElementById("GFG").innerHTML = x; } </script> </body> |
Output:
Example 2: This example does the same work by using apply() method.
HTML
<body style="text-align:center;"> <h1 style="color:green;"> GeeksForGeeks </h1> <h3>JavaScript apply() method</h3> <button onClick="fun()"> click </button> <p id="GFG"></p> <script> function fun() { let p = { fullName: function(addr1, addr2) { return this.fName + " " + this.lName + ", " + addr1 + ", " + addr2; } } let p1 = { fName:"GFGfName", lName: "GFGlName", } let x = p.fullName.apply(p1, ["India", "USA"]); document.getElementById("GFG").innerHTML = x; } </script> </body> |
Output:
Let us understand differences in a tabular form -:
|
JavaScript call() Method |
JavaScript apply() Method |
|---|---|
| It is used to write such a method that can be used on different objects. | It is used to write methods, which can be used on different objects |
| It is a Predefined Method in Javascript. | Its return value is the result of the calling function along provided this value and arguments. |
| It is used for an object to use a method that belongs to a different object. | We can use a list with this function instead of the array |
| This method can also accept parameters. | This method takes the parameter as an array |
