資料結構
網路
關係型資料庫管理系統 (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+ 次瀏覽
