数据结构
网络
关系型数据库管理系统 (RDBMS)
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C语言编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
服装设计
法律研究JavaScript 的 `return` 语句是如何工作的？
在本文中，我们将学习如何在 JavaScript 中使用 `return` 语句。`return` 语句用于将函数中的特定值返回给函数调用者。每当执行 `return` 语句时，函数将停止执行。`return` 语句之后的代码将不会执行，因此它通常是函数中的最后一条语句。
使用 `return` 语句，我们可以返回各种数据类型，_包括函数_、_对象_、_数组_以及原始值，例如_布尔值_、_整数_和_字符串_。
通过使用 `return` 语句，我们也可以返回多个值。直接返回多个值不可行。要从函数中返回多个值，我们必须使用数组或对象。
让我们讨论在 JavaScript 中使用 `return` 语句的不同方法。
- 带返回值的 `return` 语句。
- 不带返回值的 `return` 语句。
- 带多个返回值的 `return` 语句。
- 带对象的 `return` 语句。
带返回值的 `return` 语句
在本节中，我们将讨论带返回值的 `return` 语句是如何工作的。
语法
以下是带返回值的 `return` 语句的语法：
return (value);
示例
在这个示例中，我们看到一个变量正在接收名为 `n()` 的函数的返回值。在函数内部，我们看到两个变量是值的乘积。`return` 语句将值传递给变量 `s`。然后，这个乘积将显示在用户的屏幕上。
<html>
<head>
<title> Return statement with value in JavaScript </title>
</head>
<body>
<h2> The return statement with a value </h2>
<script>
var s = n(5, 6);
function n(m, p) {
return m * p;
}
document.write(`This function returns ${s} as a product of 5 and 6.`);;
</script>
</body>
</html>在上面的输出中，用户可以看到函数返回的值是传递给 `n()` 函数变量 `s` 的乘积。
不带返回值的 `return` 语句
虽然不带返回值的 `return` 语句仅用于结束程序，但仍然可以使用它。如果函数中没有显式的 `return` 语句（即 `return` 关键字不存在），则函数会自动返回 `undefined`。
语法
return();
示例
在这个示例中，我们看到一个变量正在接收名为 **`n()`** 的函数的返回值。在函数内部，我们看到两个变量是值的乘积。`return` 语句将值传递给变量 `s`。然后，这个乘积将打印在用户的屏幕上。
<html>
<head>
<title> Return statement with value in JavaScript </title>
</head>
<body>
<h2> return statement with no value.</h2>
<script>
var v = func();
function func() {
var a = 1;
while (a) {
document.write(`${a} `);
if (a == 5) {
return;
}
a++;
}
}
</script>
</body>
</html>此示例的输出显示了 `while` 循环如何每次都执行，直到变量 `a` 的值变为 5，然后进入 `if` 语句使用 `return` 语句终止循环。
带多个返回值的 `return` 语句
使用数组，我们可以使用 `return` 语句返回多个值。JavaScript 函数只能返回单个值。你可以将函数的返回结果打包为数组的元素或对象的属性，从而返回多个值。
JavaScript 不支持直接返回多个值的函数。可以使用 **数组** 或 **对象** 将多个值包装起来后再返回。
**注意** - 要从数组中提取值或从对象中提取属性，可以使用解构赋值方法。
使用数组
在此方法中，我们将看到如何使用数组让 `return` 语句返回多个值。
语法
return [name, age];
示例
在这个示例中，我们演示了如何使用 `return` 语句在数组中传递多个值。我们取四个变量，即 **`book`**、**`refID`**、**`issue_date`** 和 **`due_date`**。这四个变量分别包含一个特定值。在函数外部，我们取一个 `const` 数组，并用 `info()` 函数调用来初始化它。这反过来会打印这些值。
<html>
<body>
<h2>The return statement with multiple values using array.</h2>
<script>
function info() {
let book = 'Chronicles of Narnia',
refID = 'ISBN00127645',
issue_date = '01.06.21',
due_date = '08.07.21';
return [book, refID, issue_date, due_date];
}
const [book, refID, issue_date, due_date] = info();
document.write(`Book = ${book}<br>
Reference ID = ${refID}<br>
Issue date = ${issue_date}<br>
Due date = ${due_date}`);
</script>
</body>
</html>此输出显示了书名、参考 ID、借阅日期和到期日期。返回值以数组的形式返回这些值。
使用对象
在本教程中，我们将学习如何使用对象返回多个值。
语法
return {android,brand};示例
这里，创建了三个变量（`android`、`brand` 和 `price`)，并在 `fun()` 方法中为它们赋值。然后，我们返回一个包含 `android`、`brand` 和 `price` 的对象，作为键值对。我们在函数外部取该对象并使用 `fun()` 方法来初始化它。最后，我们打印每个变量。
<html>
<body>
<h2> The return statement with multiple values using object.</h2>
<div id="output"></div>
<script>
let output = document.getElementById("output");
function fun() {
let android = 'OnePlus 10R 5G',
brand = 'One Plus',
price = '$511.09';
return {
android,
brand,
price
};
}
let {
android,
brand,
price
} = fun();
document.write(`Android = ${android}<br>
Company = ${brand}<br>
Price = ${price}`
);
</script>
</body>
</html>此输出显示了 Android 的名称、品牌和价格。当值以对象的格式时，它会返回它们。
结论
在本教程中，我们使用了四种方法来展示在 JavaScript 中使用 `return` 语句的方法。第一种方法展示了当 `return` 语句包含参数时如何使用它。第二种方法展示了不带参数的 `return` 语句是如何工作的。第三种方法展示了如何使用数组和对象将多个值传递给 `return` 语句。
1K+ 次浏览
