Javascript 简明教程
JavaScript - Functions
JavaScript 中的 function 是可以在程序中任何地方调用的可重用代码块。它消除了反复编写相同代码的需要。它帮助程序员编写模块化代码。函数允许程序员将大型程序划分为多个小而易于管理的函数。
与其他高级编程语言一样,JavaScript 也支持使用函数编写模块化代码所需的一切功能。你一定在前面的章节中看到过 alert() 和 write() 这样的函数。我们一直在反复使用这些函数,但是它们只在核心 JavaScript 中被编写过一次。
JavaScript 也允许我们编写自己的函数。本节介绍如何在 JavaScript 中编写自己的函数。
Function Definition
在使用函数之前,我们需要定义它。在 JavaScript 中定义函数最常见的方式是使用 function 关键字,后面跟一个唯一函数名、一个可能为空的参数列表以及花括号括起来的一个语句块。
所有需要在函数调用中执行的语句都必须写在花括号内。
Calling a Function
要在脚本的某个地方稍后调用函数,您只需编写该函数的名称,后面加上圆括号 (),如下面的代码所示。
Example
下面的代码显示了输出中的按钮。当您单击按钮时,它将执行 sayHello() 函数。sayHello() 函数在输出中打印“Hello there!”信息。
<html>
<head>
<script type="text/javascript">
function sayHello() {
alert("Hello there!");
}
</script>
</head>
<body>
<p>Click the following button to call the function</p>
<form>
<input type="button" onclick="sayHello()" value="Say Hello">
</form>
<p> Use different text in the write method and then try... </p>
</body>
</html>
Function Parameters
到目前为止,我们已经看到了没有参数的函数。但在调用函数时,可以使用一个功能来传递不同参数。这些已传递参数可以在函数中捕获,并且可以对这些参数执行任何操作。函数可以接受多个以逗号分隔的参数。
Example
尝试以下示例。我们在此处修改了 sayHello 函数。现在它接受两个参数。
<html>
<head>
<script type = "text/javascript">
function sayHello(name, age) {
document.write (name + " is " + age + " years old.");
}
</script>
</head>
<body>
<p>Click the following button to call the function</p>
<form>
<input type = "button" onclick = "sayHello('Zara', 7)" value = "Say Hello">
</form>
<p>Use different parameters inside the function and then try...</p>
</body>
</html>
The return Statement
JavaScript 函数可以具有可选的 return 语句。如果您想从函数中返回值,则需要此语句。此语句应该是函数中的最后一个语句。
例如,您可以将两个数字传递给函数,然后您希望该函数在调用程序中返回它们的乘积。
Example
下面的代码定义了一个在调用程序中返回结果之前连接两个参数的函数。另外,您可以了解它如何使用 return 语句返回值。
<html>
<head>
<script type="text/javascript">
function concatenate(first, last) {
var full;
full = first + last;
return full;
}
function secondFunction() {
var result;
result = concatenate('Zara ', 'Ali');
alert(result);
}
</script>
</head>
<body>
<p>Click the following button to call the function</p>
<form>
<input type="button" onclick="secondFunction()" value="Call Function">
</form>
<p>Use different parameters inside the function and then try...</p>
</body>
</html>
Functions as Variable Values
在 JavaScript 中,函数可以与其他变量相同的方式使用。因此 JavaScript 被称为具有头等函数。函数可以作为参数传递给其他函数。