数据结构
网络
关系数据库管理系统 (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` 语句如何工作。第三种方法展示了如何使用数组和对象将多个值传递给 `return` 语句。
1000+ 次浏览
