JavaScript 如何编写函数

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

函数的类型

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

预定义函数
用户定义函数

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

要在JavaScript中创建函数，我们必须在函数名之前使用”function”关键字，如下所示：

创建函数的语法

Function functionname( parameters list)
{

Lines of code to be executed/set of instructions to be executed in order to perform a specific task.
}

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

示例

<scripttype="text/javascript">
<!--
function Hello(){
alert("Hi, there");
}
//-->
</script>

如何调用函数

我们可以通过以下方式来调用函数，以便在程序中使用该函数：

Hello();

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

<html>
<head>
    <title>Functions!!!</title>
    <script type="text/javascript">
functionmyfirstFunction()
      {
    document.write("This is just a simple user-defined  function.<br />");
      }
        myfirstFunction();
    </script>
</head>
<body>
</body>
</html>

在上述给定的程序中，我们创建了一个名为”myfirstFunction”的函数，并在该函数的定义中使用document.write();函数显示了一个消息”这只是一个简单的用户定义的函数”。为了打印该消息，我们首先需要调用该函数，正如你在程序中所看到的。

输出：

JavaScript 如何编写函数

要在脚本的其他地方调用该函数，我们只需像示例中所示，写出函数的名称：

示例

<html>
<head>
<script type = "text/javascript">
functionsayhi() {
document.write ("Hello there!");
         }
</script>

</head>

<body>
<p>Click the given button to call the function</p>
<form>
<input type = "button" onclick = "sayhi()" value = "Say Hello">
</form>

</body>
</html>

输出

JavaScript 如何编写函数

现在点击给定的按钮

JavaScript 如何编写函数

带参数的函数

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

创建带参数函数的语法

functionfunctionname( parameter1,parameter2,....parameterN)
{

Lines of code to be executed/set of instructions to be executed in order to perform a specific task.
}

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

程序

<html>
<head>
<script type = "text/javascript">
functionsayHello(name, age,gender) {
document.write (name + " is " + age + " years old" + " and gender is " + gender);
         }
</script>
</head>

<body>
<p>Click the following button to call the function</p>
<form>
<input type = "button" onclick = "sayHello(' Isabella', 23,'female')" value = "Say Hello">
</form>
</body>
</html>

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

输出

JavaScript 如何编写函数

现在点击给定的按钮。

JavaScript 如何编写函数

返回带有return语句的函数

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

带有return语句的函数的语法

Function functionname(arg1, arg2)

{

  Set of instructions to be executed

return val1;

}

我们可以通过一个示例来理解如何在函数中使用return语句：

例如

<html>
<head>
<script type = "text/javascript">
functioncombinestring(string1, string2) { // function1
varcompleteString;
completeString = string1 + string2;
returncompleteString;
         }
functionsecondFunction() {
var result;
result = combinestring('Java', 'Script');
document.write (result );
         }
</script>
</head>

<body>
<p>Click the following button to see the function in action</p>
<form>
<input type = "button" onclick = "secondFunction()" value = "Call Function">
</form>

</body>
</html>

程序的解释

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

函数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()”，我们使用表单标签为用户创建了一个按钮。当用户点击该按钮时，我们的secondfunction()将被触发。

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

输出

JavaScript 如何编写函数