函数的作用就是保存某段功能代码,以便这段代码可以多次被复用。
我们已经看到了内置函数的示例,如 alert(message)
、prompt(message, default)
。但我们也可以创建自己的函数。
1. 函数声明
使用 函数声明 创建函数。
看起来就像这样:
function showMessage() {
alert( 'Hello everyone!' );
}
function
关键字首先出现,然后是 函数名,然后是括号之间的 参数 列表(用逗号分隔,在上述示例中为空),最后是花括号之间的代码(即“函数体”)。
function name(params) {
...body...
}
函数可以通过名称调用:showMessage()
。
例如:
function showMessage() {
alert( 'Hello everyone!' );
}
showMessage();
showMessage();
调用 showMessage()
执行函数的代码。这里我们会看到显示两次消息。
这个例子清楚地演示了函数的主要目的之一:避免代码重复。
2. 函数表达式
另一种创建函数的语法称为 匿名函数表达式。
通常会写成这样:
var sayHi = function() {
alert( "Hello" );
};
在这里,函数被创建并像其他赋值一样,被明确地分配给了一个变量。函数就像一个存储在变量 sayHi
中的值。
我们可以复制函数到其他变量:
function sayHi() { // (1) 创建
alert( "Hello" );
}
var func = sayHi; // (2) 将sayHi这个函数赋值给变量func
func(); // Hello
sayHi(); // Hello
3. 参数
我们可以使用参数(也称“函数参数”)来将任意数据传递给函数。
// 函数有两个参数:`from` 和 `text`
function showMessage(from, text) { // 参数:from 和 text
alert(from + ': ' + text);
}
showMessage('Ann', 'Hello!'); // Ann: Hello! (*)
showMessage('Ann', "What's up?"); // Ann: What's up? (**)
// 当函数在 `(*)` 和 `(**)` 行中被调用时,给定值被复制到了局部变量 `from` 和 `text`。然后函数使用它们进行计算。
函数的参数包括形参和实参。来看下面的图就懂了:
形参:
可以在函数的
()
中来指定一个或多个形参。多个形参之间使用
,
隔开,声明形参就相当于在函数内部隐式声明了对应的变量,但是并不赋值。
实参:
在调用函数时,可以在
()
中指定实参。实参将会赋值给函数中对应的形参。
举例:
sum(3, 4);
sum("3", 4);
sum("Hello", "World");
//函数:求和
function sum(a, b) {
console.log(a + b);
}
控制台输出结果:
7
34
helloworld
实参的数量:
如果实参的数量多于形参的数量,多余实参不会被赋值
如果实参的数量少于形参的数量,则没有对应实参的形参将是 undefined。例如:
4. 返回值
函数可以由开发人员指定一个值作为函数调用的结果,我们叫做函数的返回值。
返回值相当于就是函数调用完,开发人员暴露给外界的一个数据,供外界去使用。
最简单的例子是将两个值相加的函数:
function sum(a, b) {
return a + b;
}
let result = sum(1, 2); // 使用result变量 接收sum函数暴露出来的的返回值
alert( result ); // 3
指令
return
可以在函数的任意位置。当执行到这时,函数停止,并将值返回给调用代码(分配给上述代码中的result
)。只使用
return
但没有返回值也是可行的。但这会导致函数立即退出。
例如:
function showMovie(age) {
if ( age < 18 ) {
return;
}
alert( "Showing you the movie" ); // (*)
// ...
}
// 在上述代码中,如果 `age<18` 返回 `true`,那么 `showMovie` 将不会运行到 `alert`。
- 空值的
return
或没有return
的函数, 返回值默认为undefined
function doNothing() {
return;
}
alert( doNothing() === undefined ); // true
- 一个函数无法同时指定两个返回值,因为写了一个
return
,就会停止函数。
5. 函数作为参数和返回值
5.1 函数作为参数
因为函数也是一种类型,可以把函数作为一个函数的参数,在一个函数中调用。
function func1(theFunc,c,d){
var r1 = c;
var r2 = d;
theFunc(r1,r2);
}
function func2(a,b){
alert(a+"----"+b);
}
func1(func2,"不凡","前端");
5.2 函数做为返回值
因为函数是一种类型,所以可以把函数作为返回值从函数内部返回。
function fn(b) {
var a = 10;
return function () {
alert(a+b);
}
}
fn(15)();
6. 函数命名
函数就是行为(action)。所以它们的名字通常是动词。它应该简短且尽可能准确地描述函数的作用。这样读代码的人就能清楚地知道这个函数的功能。
一种普遍的做法是用动词前缀来开始一个函数,这个前缀模糊地描述了这个行为。团队内部必须就前缀的含义达成一致。
例如,以 "show"
开头的函数通常会显示某些内容。
函数以 XX 开始……
"get…"
—— 返回一个值,"calc…"
—— 计算某些内容,"create…"
—— 创建某些内容,"check…"
—— 检查某些内容并返回 boolean 值,等。
这类名字的示例:
showMessage(..) // 显示信息
getAge(..) // 返回 age(gets it somehow)
calcSum(..) // 计算求和并返回结果
createForm(..) // 创建表格(通常会返回它)
checkPermission(..) // 检查权限并返回 true/false
有了前缀,只需瞥一眼函数名,就可以了解它的功能是什么,返回什么样的值。
6. 函数练习
6.1 函数 min(a, b)
写一个返回数字 a
和 b
中较小的那个数字的函数 min(a,b)
。
例如:
min(2, 5) == 2
min(3, -1) == -1
min(1, 1) == 1
6.2 函数 pow(x,n)
写一个函数 pow(x,n)
,返回 x
的 n
次方。换句话说,将 x
与自身相乘 n
次,返回最终结果。
pow(3, 2) = 3 * 3 = 9
pow(3, 3) = 3 * 3 * 3 = 27
pow(1, 100) = 1 * 1 * ...*1 = 1
6.3 函数 isZhi(n)
写一个函数 isZhi(n)
,返回true
或者false
isZhi(7); // true
isZhi(true); // false