本节我们学习函数的返回值,那么什么是返回值呢?我们来看下面这个函数:
function show(){
return "侠课岛";
}
console.log(show()); // 输出: 侠课岛
上述代码中,return
关键字后面接的就是函数的返回值。 return
关键字后面可以是任意类型的值,也可以是表达式,例如a
、a+b
等,像上代码中的"侠课岛"就是一个字符串。
函数返回值的使用
JavaScript 语言中,在函数体内,使用 return
语句可以设置函数的返回值,一旦执行 return
语句,将停止函数的运行,并运算和返回 return 后面的表达式的值。如果函数不包含 return 语句,则执行完函数体内每条语句后,返回 undefined 值。
示例:
我们先来看不带 return
语句的函数,下面是一个自定义的 num()
:
function num(){
var a = 10;
}
console.log(num()); // 输出:undefined
在这个 num()
函数中,我们仅定义了一个变量 a,并没有指定 return
语句,所以当我们使用 console.log()
输出函数时,得到一个 undefined
。从这里我们可以知道当函数中没有指定 return
语句时,默认返回值为undefined。
然后我们看一下带参函数,在这个带参函数中,我们指定一个 return
语句,并且这个 return
语句后面还有代码,先看代码:
function num(){
var a = 10;
var b = 20;
return a + b;
console.log("return语句后面的代码不会执行。")
}
console.log(num()); // 输出:30
我们执行上述代码,会发现代码执行结果输出为 30,但是 return
语句后面的代码并没有执行,这就是说一旦执行 return
语句,将停止函数的运行,不管return
语句后面有多少代码都不会再执行。
还有一点需要注意的是,执行代码时虽然 return
语句能返回函数返回值,但是并不能将结果输出在控制台,要想输出结果,还需要用到 console.log()
方法。
示例:
下面这个函数,运行后不会输出任何东西,这是因为函数中没有任何用于输出的语句,return
的功能仅仅是返回函数的值,并不会输出这个值:
function num(){
var a = 10;
return a;
}
num();
大家有没有发现,return
语句的作用还和 break
语句有点类型呢,不过 break
语句主要用于退出循环,而return
语句用于退出函数,终止函数的执行。
函数中能否包含多个return语句
我们知道一旦执行 return
语句,函数将停止运行。那么一个函数中能否有多个 return
语句呢?
一个函数体内可以同时包含多个 return
语句,但是只会执行其中一个return
语句。
示例:
function show(){
return "xkd";
return "summer";
return "mark";
}
console.log(show());
// 输出:xkd
如果函数真的需要多个返回值,我们可以将值组合成一个对象或数组进行返回。
示例:
例如下面这个函数:
function num(a, b, c){
return [a, b, c];
}
console.log(num(2, 5, 7));
// 输出:[ 2, 5, 7 ]
我们使用将多个返回值组成了一个数组,通过逗号将返回值隔开,最终输出的结果也为一个数组。
可能有人会觉得,既然可以放到数组或对象中,那么直接将值通过逗号返回可不可以,我们来试一下:
function show(){
var a = 1;
var b = 2;
var c = 3;
return a, b, c;
}
console.log(show()); // 输出:3
从输出结果可以看出,单纯的通过逗号将返回值隔开,只会返回最右边的那个值。
还有一种情况,我们可以在函数体内可以使用分支结构决定函数返回值,或者使用 return
语句提前终止函数运行。
示例:
定义一个函数,函数中有两个参数a、b,当 a 大于 b 时,返回 “a-b” 的值,当 a 等与 b 时,返回 “a + b”,当 a 小于 b 时,返回 “b-a”:
function compute(a, b){
if(a > b){
return a - b;
}else if(a == b){
return a + b;
}else{
return b - a;
}
}
console.log(compute(9, 2)); // 输出:7
console.log(compute(5, 5)); // 输出:10
console.log(compute(4, 7)); // 输出:3
我们在调用函数时,给参数赋值,然后根据 if
判断语句返回不同的返回值。
或者我们将返回值赋值给一个变量,然后再输出,也是一样的结果:
var r1 = compute(9, 2);
var r2 = compute(5, 5);
var r3 = compute(4, 7);
console.log(r1); // 输出:7
console.log(r2); // 输出:10
console.log(r3); // 输出:3