JavaScript - 函式呼叫

函式呼叫

在 JavaScript 中，函式呼叫是執行函式的過程。JavaScript 函式可以透過函式名稱後跟一對圓括號來呼叫。當你在 JavaScript 中編寫函式程式碼時，它使用表示式和語句定義函式。現在，要計算這些表示式，就需要呼叫函式。函式呼叫是函式呼叫或函式執行的同義詞。

JavaScript 函式可以使用函式宣告或函式表示式來定義。函式定義中大括號內的程式碼在定義函式時不會執行。要執行程式碼，我們需要呼叫函式。

呼叫函式和呼叫函式是兩個常用的可互換術語。但是我們可以不呼叫函式而呼叫函式。例如，自執行函式無需呼叫即可執行。

語法

JavaScript 中函式呼叫的語法如下：

functionName()
OR
functionName(arg1, arg2, ... argN);

這裡 'functionName' 是要呼叫的函式。我們可以傳遞任意數量的引數，其數量與函式定義中列出的引數數量相同。

示例

在下面的示例中，我們定義了 merge() 函式，它接受兩個引數。之後，我們使用函式名稱透過傳遞引數來呼叫函式。

<html>
<body>
   <p id = "output"> </p>
   <script>    
      function merge(str1, str2) {
         return str1 + str2;
      }
      document.getElementById("output").innerHTML = merge("Hello", " World!");  
   </script>
</body>
</html>

輸出

Hello World!

函式建構函式的呼叫

使用 'new' 關鍵字呼叫函式時，它充當函式建構函式。函式建構函式用於根據函式定義建立物件。

語法

以下是將函式作為建構函式呼叫的語法。

const varName = new funcName(arguments);

在上述語法中，我們使用 'new' 關鍵字呼叫了函式並傳遞了引數。

示例

在下面的示例中，我們將函式用作物件模板。這裡，'this' 關鍵字表示函式物件，我們用它來初始化變數。

之後，我們使用 'new' 關鍵字呼叫 car 函式，以使用函式模板建立物件。

<html>
<body>
   <p id = "output"> The ODCar object is: </p>
   <script>
      function Car(name, model, year) {
         this.name = name;
         this.model = model;
         this.year = year;
      }
      const ODCar = new Car("OD", "Q6", 2020);
      document.getElementById("output").innerHTML += JSON.stringify(ODCar);
   </script>
</body>
</html>

輸出

The ODCar object is: {"name":"OD","model":"Q6","year":2020}

物件方法呼叫

在本教程中，我們還沒有介紹 JavaScript 物件，但我們將在接下來的章節中介紹。在這裡，讓我們簡要了解一下物件方法呼叫。

JavaScript 物件也可以包含函式，這稱為方法。

語法

以下是呼叫 JavaScript 物件方法的語法：

obj.func();

在上述語法中，'obj' 是包含方法的物件，'func' 是要執行的方法名稱。

示例

在下面的示例中，我們定義了 'obj' 物件，它包含 'name' 屬性和 'getAge()' 方法。

在物件外部，我們透過物件引用訪問該方法並呼叫該方法。在輸出中，該方法列印 10。

<html>
<body>
   <p id = "output">The age of John is: </p>
   <script>
      const obj = {
         name: "John",
         getAge: () => {
            return 10;
         }
      }
      document.getElementById("output").innerHTML +=  obj.getAge();
   </script>
</body>
</html>

輸出

The age of John is: 10

自執行函式

JavaScript 中的自執行函式在定義後立即執行。不需要呼叫這些型別的函式來呼叫它們。自執行函式始終使用匿名函式表示式定義。這些型別的函式也稱為立即呼叫的函式表示式 (IIFE)。要呼叫這些函式，我們將函式表示式包裝在分組運算子（圓括號）中，然後新增一對圓括號。

示例

嘗試以下示例。在這個示例中，我們定義一個函式，用於在警告框中顯示“Hello world”訊息。

<html>
   <head>
      <script>
  	     (function () {alert("Hello World")})();
      </script>
   </head>
   <body>
   </body>
</html>

呼叫函式的其他方法

JavaScript包含兩種特殊的方法以不同的方式呼叫函式。這裡，我們在下面的表格中解釋了每種方法。

方法	函式呼叫	引數
call()	立即呼叫	單獨的引數
apply()	立即呼叫	引數陣列

call()和apply()方法的區別在於它們接收函式引數的方式。我們將在接下來的章節中逐一學習以上每種方法及其示例。

列印頁面