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 ?。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。