JavaScript function 语句
JavaScript function 语句
实例
声明一个函数并在调用该函数时在 id="demo" 的元素中输出 "Hello World"：
function myFunction() { // 声明函数
document.getElementById("demo").innerHTML = "Hello World!";
}
myFunction(); // 调用函数
完整实例：
<!DOCTYPE html>
<html>
<body>
<p>本例调用一个函数，该函数在 id="demo" 的 p 元素中输出 "Hello World"。</p>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World!";
}
myFunction();
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
页面下方有更多 TIY 实例。
定义和用法
function 语句声明函数。
声明的函数是“被保存供以后使用的”，并且将在稍后调用时执行。
在 JavaScript 中，函数是对象，它们同时拥有属性和方法。
也可以使用表达式定义函数（请参阅函数定义）。
请阅读我们的 JavaScript 教程，了解您需要学习的有关函数的所有知识。请从关于 JavaScript 函数和 JavaScript 作用域的章节开始。如需更多详细信息，请阅读我们关于函数定义、参数、调用和闭包的教程。
提示：请使用 return 语句从函数返回值。
浏览器支持
| 语句 | Chrome | IE | Firefox | Safari | Opera |
|---|---|---|---|---|---|
| function | 支持 | 支持 | 支持 | 支持 | 支持 |
语法
function functionName(parameters) {
code to be executed
}
参数值
| 参数 | 描述 |
|---|---|
| functionName | 必需。规定函数的名称，可以“保存以备后用”。函数名可以包含字母、数字、下划线和美元符号（规则与变量相同）。 |
| parameters |
可选。指定一组零个或多个参数名称，以逗号分隔。 函数参数是函数定义中列出的名称。 函数参数是函数在调用时收到的实际值。在函数内部，参数用作局部变量。 注释：如果调用函数时缺少参数，则缺少参数的值将设置为 undefined。 |
技术细节
| JavaScript 版本： | ECMAScript 1 |
|---|
更多实例
示例代码：
返回 PI 的值：
function myFunction() {
return Math.PI;
}
完整实例：
<!DOCTYPE html>
<html>
<body>
<p>本例调用一个返回 PI 值的函数：</p>
<p id="demo"></p>
<script>
function myFunction() {
return Math.PI;
}
document.getElementById("demo").innerHTML = myFunction();
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
示例代码：
返回 a 和 b 的乘积：
function myFunction(a, b) {
return a * b;
}
完整实例：
<!DOCTYPE html>
<html>
<body>
<p>本例调用一个执行计算的函数，并返回结果：</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
return a * b;
}
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
示例代码：
通过使用函数，您可以多次使用有不同参数的相同代码，以产生不同的结果。
将华氏度转换为摄氏度：
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
完整实例：
<!DOCTYPE html>
<html>
<body>
<p>本例调用函数将华氏温度转换为摄氏温度：</p>
<p id="demo"></p>
<script>
function toCelcius(f) {
return (5/9) * (f-32);
}
document.getElementById("demo").innerHTML = toCelcius(32);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
示例代码：
函数可用作变量。
代替：
temp = toCelsius(32);
text = "The temperature is " + temp + " Centigrade";
You can use:
text = "The temperature is " + toCelsius(32) + " Centigrade";
完整实例：
<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML =
"The temperature is " + toCelsius(32) + " Centigrade";
function toCelsius(fahrenheit) {
return (5/9) * (fahrenheit-32);
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
示例代码：
JavaScript 函数有一个称为 arguments 对象的内置对象。
arguments.length 属性返回调用函数时收到的参数数量：
function myFunction(a, b) {
return arguments.length;
}
完整实例：
<!DOCTYPE html>
<html>
<body>
<p>arguments.length 属性返回函数接收到的参数数量：</p>
<p id="demo"></p>
<script>
function myFunction(a, b) {
return arguments.length;
}
document.getElementById("demo").innerHTML = myFunction(4, 3);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
示例代码：
单击按钮调用函数，该函数将在 id="demo" 的元素中输出 "Hello World"：
<button onclick="myFunction()">Click me</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
</script>
完整实例：
<!DOCTYPE html>
<html>
<body>
<p>单击按钮触发一个函数，该函数将在 id="demo" 的 p 元素中输出 "Hello World"。</p>
<button onclick="myFunction()">点击我</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
示例代码：
JavaScript 函数也可使用表达式来定义。
函数表达式可以存储在变量中：
var x = function (a, b) {return a * b};
完整实例：
<!DOCTYPE html>
<html>
<body>
<p>函数可以存储在变量中：</p>
<p id="demo"></p>
<script>
var x = function (a, b) {return a * b};
document.getElementById("demo").innerHTML = x;
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
示例代码：
将函数表达式存储在变量中后，该变量可以用作函数：
var x = function (a, b) {return a * b};
var z = x(4, 3);
完整实例：
<!DOCTYPE html>
<html>
<body>
<p>把函数存储在变量中后，该变量可用作函数：</p>
<p id="demo"></p>
<script>
var x = function (a, b) {return a * b};
document.getElementById("demo").innerHTML = x(4, 3);
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
相关页面
JavaScript 教程：JavaScript 函数
JavaScript 教程：JavaScript 作用域
JavaScript 教程：JavaScript 函数定义
JavaScript 教程：JavaScript 函数参数
JavaScript 教程：JavaScript 函数调用
JavaScript 教程：JavaScript 函数闭包
JavaScript 参考手册：JavaScript return 语句
