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()方法的区别在于它们接收函数参数的方式。我们将在接下来的章节中逐一学习以上每种方法及其示例。

打印页面