Javascript call和apply的区别用法及代码示例

JavaScript call() 方法：它调用该方法，将所有者对象作为参数。关键词这个指的是函数或其所属对象的‘owner’。我们可以调用一个可以在不同对象上使用的方法。

用法:

object.objectMethod.call( objectInstance, arguments )

JavaScript apply() 方法：apply()方法用于编写方法，可以用在不同的对象上。它与函数 call() 不同，因为它将参数作为数组。

用法:

object.objectMethod.apply(objectInstance, arrayOfArguments)

call() 和 apply() 方法之间的区别：唯一的区别是 call() 方法采用逗号分隔的参数，而 apply() 方法采用参数数组。

示例 1：此示例使用call()方法来调用函数。

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>

输出：

示例 2：此示例使用 apply() 方法执行相同的工作。

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>

输出：

让我们以表格形式了解差异：

JavaScript call() Method	JavaScript apply() Method
就是用来写这样一个可以用在不同对象上的方法。	用于编写方法，可以用在不同的对象上
它是 Javascript 中的预定义方法。	它的返回值是调用函数以及提供的该值和参数的结果。
它用于让一个对象使用属于不同对象的方法。	我们可以使用此函数的列表来代替数组
该方法也可以接受参数。	该方法将参数作为数组

相关用法

注：本文由纯净天空筛选整理自PranchalKatiyar大神的英文原创作品 What is the difference between call and apply in JavaScript ?。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。