Open In App

What is the difference between call and apply in JavaScript ?

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

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


Last Updated : 26 Dec, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads