JavaScript教程-JavaScript 返回语句

return 语句用于从函数向函数调用者返回特定的值。当调用 return 语句时，函数将停止执行。return 语句应该是函数中的最后一条语句，因为在 return 语句之后的代码将无法被执行。

我们可以使用 return 语句返回基本值（如布尔值、数字、字符串等）和对象类型（如函数、对象、数组等）。

我们还可以使用 return 语句返回多个值。尽管不能直接实现，但我们可以使用 Array 或 Object 来从函数中返回多个值。

语法

return 表达式;

上述语法中的表达式* 是返回给函数调用者的值，它是可选的。如果未指定 表达式*，则函数将返回 undefined。

在 return 关键字和值之间不允许使用行终止符。我们可以通过以下几行代码理解这一点。假设我们将 return 语句写成以下形式：

return
x + y;

然后，它将被转换为：

return;
x + y;

在 return 语句之后自动插入了分号。在 return 语句之后编写的代码（x + y;）将被视为 无法访问的代码。

为了解决这个问题，我们可以使用括号。可以写成：

return (
x + y;
);

现在，让我们看一些在JavaScript中使用 return 语句的示例。

示例1

这是一个使用 return 语句的简单示例。在此示例中，我们返回两个数字的乘积结果，并将该值返回给函数的调用者。

变量 res 是函数的调用者；它调用了函数 fun() 并将两个整数作为函数的参数传递。结果将存储在 res 变量中。在输出中，值 360 是参数 12 和 30 的乘积。

<!DOCTYPE html>
<html>
<head>
<title>return 语句示例</title>
</head>
<body style="text-align: center;">
<h2>Welcome to the javaTiku.cn</h2>
<h3>JavaScript 的 return 语句示例</h3>
<script>
var res = fun(12, 30);
function fun(x, y)
{
    return x * y;
}
document.write(res);
</script>
</body>
</html>

示例2

在此示例中，我们使用 return 语句中断了一个函数。当调用 return 语句时，函数立即停止执行。

有一个无限的 while 循环和变量 i，它被初始化为1。循环会一直持续，直到变量 i 达到 4 为止。当变量的值为4时，由于 return 语句，循环停止执行。循环后面的语句将永远不会被执行。

在这里，return 语句没有使用 *表达式*，因此它返回 undefined。

<!DOCTYPE html>
<html>
<head>
<title>return 语句示例</title>
</head>
<body style="text-align: center;">
<h2>Welcome to the javaTiku.cn</h2>
<h3>JavaScript 的 return 语句示例</h3>
<script>
var x = fun();
function fun() {
    var i = 1;
    while(i) {
        document.write(i + '<br>');
        if (i == 4) {
            return;
        }
        document.write(i + '<br>');
        i++;
    }
    document.write('Hello world');
}
</script>
</body>
</html>

接下来，我们将看到如何使用 return 语句返回多个值。通常，JavaScript 函数返回单个值，但我们可以通过使用数组或对象返回多个值。要返回多个值，我们可以将这些值打包为对象的属性或数组元素。

示例3 - 使用数组返回多个值

在此示例中，我们使用数组返回多个值。在这里，我们使用 ES6 数组解构 语法来解开数组的值。

<!DOCTYPE html>
<html>
<head>
<title>JavaScript return</title>
</head>
<body>
<h1>Welcome to the javaTiku.cn</h1>
<h3>使用数组返回多个值的示例</h3>
<script>
function getData() {
    let fname = 'John',
    lname = 'Rickman',
    age = '25',
    occupation = 'Private Employee';
    
    return [fname, lname, age, occupation];
}

const [fname, lname, age, occupation] = getData();

document.write("Name = " + fname + " " + lname + "<br>");
document.write("Age = " + age + "<br>");
document.write("Occupation = " + occupation);
</script>
</body>
</html>

示例4 - 使用对象返回多个值

在此示例中，我们使用对象返回多个值。在这里，我们使用 ES6 对象解构 语法来解开对象的值。

<!DOCTYPE html>
<html>
<head>
<title>JavaScript return</title>
</head>
<body>
<h1>Welcome to the javaTiku.cn</h1>
<h3>使用对象返回多个值的示例</h3>
<script>
function getData() {
    let fname = 'John',
    lname = 'Rickman',
    age = '25',
    occupation = 'Private Employee';
    
    return {
        fname,
        lname,
        age,
        occupation
    };
}

let {fname, lname, age, occupation} = getData();

document.write("Name = " + fname + " " + lname + "<br>");
document.write("Age = " + age + "<br>");
document.write("Occupation = " + occupation);
</script>
</body>
</html>

JavaScript教程-JavaScript 返回语句

语法

示例1

示例2

示例3 - 使用数组返回多个值

示例4 - 使用对象返回多个值

推荐文章

其它