如何在 JavaScript 中编写函数？

JavaScript 函数是一段代码块，包含一组用于执行特定任务的指令。函数也可以被视为一段可以在整个程序中反复使用的代码，它可以避免重复编写相同的代码。它还可以帮助程序员/编码人员将庞大的程序分解成几个小的函数。

函数的类型

与其他编程语言（如 C、C++ 和 Java 等）一样，JavaScript 中有两种类型的函数。

• 预定义函数
• 用户定义函数

在这里，我们将学习如何在 JavaScript 中编写用户定义函数。

要创建 JavaScript 函数，我们必须在编写函数名之前使用“function”关键字，如您在给出的语法中所示。

创建函数的语法

在使用函数或在我们的程序中调用函数之前，我们必须在花括号之间定义它的定义。根据您的要求，我们可以将参数列表留空，如您在上面的语法中所示。

示例

如何调用函数

当我们在程序中想要使用函数时，我们可以通过写它的名字来调用函数，如下所示。

让我们看一个程序，在其中我们将创建一个函数并使用它。

在上面给出的程序中，我们创建了一个名为“myfirstFunction”的函数，并在该函数的定义中，我们使用 document.write() 函数显示了消息“This is just a simple user-defined function”。要打印该消息，我们首先需要调用该函数，如您在程序中所示。

输出

要在脚本的其他地方调用该函数，只需写出它的名字即可，如您在给出的示例中所见。

示例

输出

现在点击给定的按钮。

带参数的函数

我们在程序中使用的函数是没有参数的（或者我们可以说它是一个无参函数），因为我们在参数列表中没有给出任何参数，并将其留空。但我们也可以在函数中使用参数，并且我们可以在函数中使用任意数量的参数，但它们必须用逗号分隔。这些参数由函数捕获，然后可以在函数内部对这些参数执行任何操作。

带参数创建函数的语法

我们可以通过示例更容易地理解如何在函数中使用参数。

程序

在此程序中，我们在 HTML 文档的 head 部分创建了一个名为“sayHello()”的函数，它有三个参数：name、age 和 gender。为了使用这个函数，我们还在程序的主体部分使用 form 标签创建了一个按钮，并传递了值作为参数。当用户单击该按钮时，我们的函数将被调用并执行。

输出

现在点击给定的按钮。

带 return 语句的函数

在 JavaScript 中，我们可以创建能够返回值的函数。要创建这种类型的函数，我们必须使用 return 语句，但它必须是函数体（或函数定义）中的最后一条语句。另一个需要记住的重要事项是，我们可以在一个函数中使用一个 return 语句。如果我们尝试在一个函数中使用多个 return 语句，将只考虑一个 return 语句，即程序控制首先到达的那个。

带 return 语句的函数语法

我们可以通过示例更容易地理解如何在函数中使用 return 语句。

示例

程序解释

在此程序中，我们创建了两个函数：combinestring(string1, string2) 和 secondFunction()，并在 HTML 文档的 head 部分定义了它们的定义。

函数 1

在“combineString(string1, string2)”函数的函数体内，我们创建了一个名为“completestring”的变量来存储合并两个字符串后的字符串。为了返回存储在此变量中的值，我们使用了一个 return 语句，如您在程序中所示。

函数 2

在 secondfunction() 的函数体内，我们创建了一个名为“result”的变量。我们调用了我们的第一个函数“completeString(string1, string2)”。当调用“secondFunction()”时，“completeString(string1,string2)”也会被调用，并且该函数的结果存储在“result”变量中。

当“completeString(string1, string2)”函数的执行完成时，返回的值/数据将存储在“result”变量中，并且在“secondfunction()”函数的函数体内，我们使用 document.write() 语句显示了存储在“result”变量中的值。

为了调用“secondFunction()”，我们使用 form 标签为用户创建了一个按钮。当用户单击该按钮时，我们的 secondFunction() 将被触发。

注意：正如您在程序中看到的，我们在“completeString(string1, string2)”函数的函数体中使用了“return”语句作为最后一条指令。

输出

点击给定的按钮。