JavaScript - 函式引數

函式引數和引數

在 JavaScript 中，函式引數是在函式定義中括號內列出的變數。一個函式可以有多個引數，用逗號分隔。函式引數是在呼叫函式時傳遞給函式的值。我們定義函式列出引數，並呼叫函式傳遞引數。

傳遞給函式的引數數量必須與函式定義中的引數數量匹配。如果不匹配，可能會得到意外的結果。

語法

在 JavaScript 中使用函式引數的語法如下：

function functionName (parameter1, parameter2, parameter3) {
  //statements
}

在上面的語法中，函式引數是 'parameter1'、'parameter2' 和 'parameter3'。

引數規則

JavaScript 函式不會檢查呼叫函式時傳遞的引數數量。
不需要指定函式引數的資料型別。
JavaScript 編譯器不會對傳遞的函式引數執行型別檢查。

JavaScript 的函式引數是在呼叫函式時傳遞給函式的變數或值。

functionName (10, b, 'Hello');

在上面的語法中，第一個引數是數字型別，第三個是字串型別。第二個引數是變數，在程式碼中前面已定義。

示例：函式引數和引數

在下面的程式碼中，mult() 函式接受 4 個引數。您可以觀察到未定義引數的型別。我們在函式體中將引數值相乘並返回結果值。

呼叫函式時，我們傳遞了 4 個數值作為函式引數。使用者可以觀察不同函式引數的函式輸出。

<html>
<body>
   <p id = "output"> </p>
   <script>
      function mult(a, b, c) {
         let res = a * b * c;
         return res;
      }
      let ans = mult(2, 3, 4);
      document.getElementById("output").innerHTML = 
	  "The multiplication of 2, 3, and 4 is " + ans;
   </script>
</body>
</html>

輸出

The multiplication of 2, 3, and 4 is 24

arguments 物件

在 JavaScript 中，每個函式都可以有一個 'arguments' 物件。它以陣列格式包含呼叫函式時傳遞的所有引數。即使沒有指定函式的引數，我們也可以遍歷陣列並獲取每個引數。

示例

在下面的示例中，函式定義不包含任何引數，但在呼叫函式時我們傳遞了 4 個引數。因此，我們使用函式體內的迴圈遍歷 arguments[] 陣列，逐個訪問所有引數。

在函式體中，我們將所有引數合併並返回 'final' 字串。

<html>
<body>
   <p id = "output"> </p>
   <script>
      function merge() {
         let final = "";
         for (let p = 0; p < arguments.length; p++) {
            final += arguments[p] + " ";
         }
         return final;
      }
      let ans = merge("Hi", "I", "am", "John!");
      document.getElementById("output").innerHTML = 
	  "The merged string is: " + ans;
   </script>
</body>
</html>

輸出

The merged string is: Hi I am John!

按值傳遞引數

在函式中，當您按值將引數傳遞給函式呼叫時，它會將引數值傳送到函式定義的引數。因此，當您更新函式引數時，函式引數不會更改。

示例

在下面的程式碼中，我們定義了 'val1' 和 'val2' 變數，它們在函式外部，並作為函式引數傳遞。

在函式體中，我們改變了引數的值。在輸出中，您可以看到即使更新了引數值，'val1' 和 'val2' 的實際值也沒有改變。

<html>
<head>
   <title> JavaScript - Arguments are passed by value </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      function update(val1, val2) {
         val1 = 20;
         val2 = 30;
      }

      var val1 = "Hello";
      var val2 = "World";

      output.innerHTML += "Before calling the function! <br>";
      output.innerHTML += "val1 = " + val1 + ", val2 = " + val2 + "<br>";

      update(val1, val2);

      output.innerHTML += "After calling the function! <br>";
      output.innerHTML += "val1 = " + val1 + ", val2 = " + val2 + "<br>";
    </script>
</body>
</html>

輸出

Before calling the function!
val1 = Hello, val2 = World
After calling the function!
val1 = Hello, val2 = World

按引用傳遞引數

當您將物件作為引數傳遞時，函式會將物件的地址作為引數傳遞給函式定義。因此，這被稱為按引用傳遞引數。

在函式體中，如果您更改物件的屬性，它也會反映在函式外部。

示例

在下面的程式碼中，我們將 'obj' 物件作為函式引數傳遞。在函式體中，我們更改了物件 'domain' 屬性的值。

在輸出中，您可以觀察到，在呼叫函式之後，即使在函式外部，'domain' 屬性的值也發生了變化，因為物件是按引用傳遞的。

<html>
<head>
   <title> JavaScript - Arguments are passed by reference </title>
</head>
<body>
   <p id = "output"> </p>
   <script>
      const output = document.getElementById("output");
      function update(obj) {
         obj.domain = "www.tutorialspoint.com";
      }
      var obj = {
         domain: "www.google.com",
      }
      output.innerHTML += "Before calling the function! <br>";
      output.innerHTML += "domain = " + obj.domain + "<br>";
      update(obj);
      output.innerHTML += "After calling the function! <br>";
      output.innerHTML += "domain = " + obj.domain + "<br>";
    </script>
</body>
</html>

輸出

Before calling the function!
domain = www.google.com
After calling the function!
domain = www.tutorialspoint.com

列印頁面