Javascript 简明教程

JavaScript - Function Parameters

Function Parameters and Arguments

JavaScript 中的 function parameters 是在函数定义中列在括号内的变量。一个函数可以有多个由逗号分隔的参数。 function arguments 是在调用函数时传递给函数的值。我们定义了列出参数的函数，并调用了传递参数的函数。

The function parameters in JavaScript are variables listed inside the parentheses in the function definition. A function can have multiple parameters separated by commas. The function arguments are the values that are passed to function when it is called. We define function listing the parameters and call the function passing the arguments.

传递给函数的参数数量必须与函数定义中的参数数量相匹配。否则，你可能会得到意外的结果。

The number of arguments that you pass to the function must match the number of parameters in the function definition. If not, you may get unexpected result.

Syntax

在 JavaScript 中使用 function parameters 的语法如下 −

The syntax to use function parameters in JavaScript is as follows −

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

在上述语法中，函数参数为“parameter1”、“parameter2”和“parameter3”。

In the above syntax, the function parameters are 'parameter1', 'parameter2', and 'parameter3'.

Parameter Rules

  1. JavaScript functions don’t check the number of arguments passed while invoking the function.

  2. Don’t need to specify the data type of function parameters.

  3. JavaScript compiler doesn’t perform the type-checking on the passed function arguments.

JavaScript function arguments 是在调用函数时传递给该函数的变量或值。

The JavaScript function arguments are the variables or values passed to the function while invoking it.

functionName (10, b, 'Hello');

在上述语法中，第一个参数为数字数据类型，第三个参数为字符串数据类型。第二个参数是变量，在代码中已定义。

In the above syntax, the first argument is of number data type, and the third is of string data type. The second argument is variable, which is defined earlier in the code.

Example: Function Parameters and Arguments

在以下代码中，mult() 函数采用 4 个参数。可以看出，没有定义参数类型。我们在函数主体中乘以参数值并返回结果值。

In the below code, the mult() function takes 4 parameters. You can observe that the type of parameters is not defined. We multiply the parameter values in the function body and return the resultant value.

在调用函数时，我们将 4 个数字值作为函数参数传递。用户可以查看函数针对不同函数参数输出的内容。

While calling the function, we passed 4 number values as a function argument. Users can observe the output of the function for the different function arguments.

<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

Argument Object

在 JavaScript 中，每个函数都可以有一个“arguments”对象。调用函数时，它会以数组格式包含所有传递的参数。我们可以遍历数组并获取每个参数，即使未指定函数的参数。

In JavaScript, each function can have an 'arguments' object. It contains all passed arguments while invoking the function in the array format. We can traverse through the array and get each argument even if the function’s parameters are not specified.

Example

在以下示例中，函数定义不包含任何参数，但在调用函数时，我们传递了 4 个参数。因此，我们在函数主体中使用循环遍历 arguments[] 数组，以逐个访问所有参数。

In the example below, the function definition doesn’t contain any parameters, but we have passed the 4 arguments while calling the function. So, we traverse through the arguments[] array using the loop inside the function body to access all arguments one by one.

在函数主体中，我们将所有参数合并，并返回“final”字符串。

In the function body, we merge all arguments and return the 'final' string.

<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!

Passing Arguments by Value

在函数中，当通过值将参数传递给函数调用时，它会将参数值发送给函数定义的参数。因此，当你更新函数参数时，函数参数不会发生变化。

In the function, when you pass the argument by value to a function call, it sends the argument value to the parameter of the function definition. So, when you update the function parameters, the function argument doesn’t get changed.

Example

在以下代码中，我们在函数外定义了“val1”和“val2”变量，并将它们作为函数参数传递。

In the below code, we have defined the 'val1' and 'val2' variables outside the function and passed them as a function argument.

在函数主体中，我们更改参数值。在输出中，可以看到即使更新了参数值，“val1”和“val2”的实际值也没有发生变化。

In the function body, we change the parameter value. In the output, you can see that even after updating the parameter value, the actual value of the 'val1' and 'val2' is not changed.

<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

Passing Arguments by Reference

当你将对象作为参数传递时，函数会将对象的地址作为参数发送给函数定义。因此，这被称为通过引用传递参数。

When you pass the object as an argument, the function sends the address of the object as a parameter to the function definition. So, it is called the arguments are passed by reference.

在函数主体中，如果你更改了对象的属性，它也将反映到函数外部。

In the function body, if you change the property of an object, it will also reflect the outside of the function.

Example

在以下代码中，我们将“obj”对象作为函数参数传递。在函数主体中，我们更改对象的“domain”属性的值。

In the below code, we pass the 'obj' object as a function argument. In the function body, we change the value of the 'domain' property of the object.

在输出中，可以看到“domain”属性的值在调用该函数后，即使在函数外部也发生了变化，这是因为对象是通过引用传递的。

In the output, you can observe that the value of the 'domain' property is changed even outside the function after invoking the function as objects are passed by reference.

<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