详解JavaScript函数返回值和return语句

1. 什么是函数返回值

在JavaScript中函数返回值是指函数执行完成后返回的值。一个函数可以有一个返回值,也可以没有返回值。当函数没有显式地使用return语句返回值时,函数返回的是undefined。

function add(a, b){

return a + b;

}

console.log(add(1, 2)); // 3

在上面的代码中,函数add有两个参数a和b。函数执行后返回a和b的和,也就是3。

2. 使用return语句

2.1 在函数中使用return语句

在函数中使用return语句可以显式地返回一个值。

function add(a, b){

return a + b;

}

console.log(add(1, 2)); // 3

上面的函数add返回了a和b的和。

当函数执行到return语句时,函数会立即停止执行并返回指定的值。

function foo(a){

if (a > 0){

return 'a is positive';

}

return 'a is non-positive';

}

console.log(foo(2)); // a is positive

console.log(foo(-1)); // a is non-positive

上面的函数foo返回一个字符串,描述参数a的正负性。

2.2 return语句后面的代码不会执行

在函数中执行return语句后,函数后续的代码都不会执行。

function add1(a){

if (a > 10){

return 'a is too large';

}

console.log('add1 will not run');

return a + 1;

}

console.log(add1(1)); // 2

console.log(add1(11)); // a is too large

在上面的代码中,当参数a小于等于10时,函数返回a加1;当参数a大于10时,函数返回一个字符串,描述参数a太大。

当参数a小于等于10时,console.log('add1 will not run')不会执行。

2.3 return语句的作用域

return语句只能用于函数内部,不能在函数外部使用。在函数内部,return语句可以在任何位置使用,包括嵌套在循环和条件语句内部。

function foo(){

var i = 0;

while (true){

i++;

if (i > 10){

return 'i is greater than 10';

}

}

}

console.log(foo()); // i is greater than 10

上面的函数foo使用while循环计算变量i的值。当i大于10时,函数返回一个字符串,描述变量i的大小。

3. 没有返回值的函数

在JavaScript中,函数可以没有返回值,函数的返回值为undefined。

function printHello(){

console.log('Hello');

}

printHello(); // Hello

上面的函数printHello没有返回值,但会执行console.log('Hello')打印Hello。

4. return语句的用途

在JavaScript中,return语句有以下几个作用:

4.1 返回函数执行结果

return语句可以返回函数执行的结果。

function add(a, b){

return a + b;

}

var sum = add(1, 2);

console.log(sum); // 3

上面的函数add返回a和b的和。

4.2 停止函数执行

当函数执行到return语句时,函数会立即停止执行。

function foo(a){

if (a < 0){

console.log('a is negative');

return;

}

console.log('a is non-negative');

}

foo(-1); // a is negative

foo(1); // a is non-negative

上面的函数foo会根据参数a的正负性打印不同的信息。当参数a小于0时,函数打印'a is negative'并停止执行;否则打印'a is non-negative'。

4.3 模拟break语句

在函数中使用return语句可以模拟break语句。

function findIndex(arr, value){

for (var i = 0; i < arr.length; i++){

if (arr[i] === value){

return i;

}

}

return -1;

}

var arr = [1, 2, 3, 4, 5];

console.log(findIndex(arr, 2)); // 1

console.log(findIndex(arr, 6)); // -1

上面的函数findIndex接收一个数组和一个值,返回值在数组中的索引。如果值不在数组中,函数返回-1。

4.4 返回对象

return语句可以返回一个JavaScript对象。

function createPerson(name, age){

return {

name: name,

age: age

};

}

var person = createPerson('Tom', 18);

console.log(person.name); // Tom

console.log(person.age); // 18

上面的函数createPerson返回一个JavaScript对象,包含两个属性name和age。

5. 小结

在JavaScript中,函数返回值是指函数执行完成后返回的值。使用return语句可以显式地返回一个值,也可以在函数中模拟break语句,停止函数执行,并且可以返回一个JavaScript对象。