> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/web/js/grammar/statement/flow/jump/return.md).

# return

[JS](/web/js.md) ⟩ [statement](/web/js/grammar/statement.md) ⟩ [control flow](/web/js/grammar/statement/flow.md) ⟩ [jump](/web/js/grammar/statement/flow/jump.md) ⟩ return

{% hint style="success" %}
([statement](/web/js/grammar/statement.md))&#x20;

<mark style="color:yellow;">**end execution**</mark> and <mark style="color:yellow;">**return**</mark> a [value](/web/js/val.md) to the <mark style="color:yellow;">**caller**</mark>. [undefined](/web/js/val/prim/undefined.md) is returned if <mark style="color:blue;">`expr`</mark> <mark style="color:yellow;">**omitted**</mark>.

```javascript
return <expr>
```

{% endhint %}

{% tabs %}
{% tab title="🧨 雷區" %}
{% hint style="danger" %} <mark style="color:purple;">**return**</mark> <mark style="color:yellow;">**statement**</mark> can be used <mark style="color:red;">**only**</mark>**&#x20;**<mark style="color:yellow;">**within the body of**</mark> a [function](/web/js/val/func.md), using it <mark style="color:yellow;">**anywhere**</mark>**&#x20;**<mark style="color:red;">**else**</mark> causes a [<mark style="color:red;">**SyntaxError**</mark>](/web/js/err/syntax.md).
{% endhint %}

{% hint style="danger" %} <mark style="color:purple;">**return**</mark> is affected by [automatic semicolon insertion](/web/js/grammar/token/punctuator/semicolon/automatic-semicolon-insertion.md):exclamation:
{% endhint %}

:warning: 注意：用 <mark style="color:blue;">`return`</mark> 時，不要寫成這樣：

```javascript
return
    a + b;
```

:x: 這種寫法 <mark style="color:blue;">`return`</mark> 後面會被自動加上 "<mark style="color:blue;">`;`</mark>" 分號:exclamation:

```javascript
return;        // 自動加上「;」分號❗️ 
a + b;
```

:white\_check\_mark: 建議寫成這樣：

```javascript
return (
    a + b
);
```

{% endtab %}

{% tab title="⭐️ 重點" %}
{% hint style="warning" %}
when the <mark style="color:blue;">`{ ... }`</mark> of an [arrow function](/web/js/val/func/arrow.md) are <mark style="color:yellow;">**omitted**</mark>, a <mark style="color:yellow;">**return value**</mark> is sent out <mark style="color:red;">**without**</mark> using [return](/web/js/grammar/statement/flow/jump/return.md).
{% endhint %}

{% hint style="danger" %}
if the <mark style="color:yellow;">**code**</mark> you need to <mark style="color:yellow;">**wrap**</mark> a [scope](/web/js/scope.md) <mark style="color:yellow;">**around**</mark> has [return](/web/js/grammar/statement/flow/jump/return.md), [this](/web/js/concept/execution-context/this.md), [break](/web/js/grammar/statement/flow/jump/break.md), or [continue](/web/js/grammar/statement/flow/jump/continue.md) in it, <mark style="color:red;">**don't**</mark>**&#x20;**<mark style="color:yellow;">**use**</mark> a [function](/web/js/val/func.md)/[IIFE](/web/js/val/func/expr/iife.md)(which has <mark style="color:yellow;">**its own**</mark> [function boundary](/web/js/val/func/boundary.md)), use a [block](/web/js/grammar/statement/other/block.md) instead❗️

📗 [You Don't Know JS Yet: Scopes & Closrues](https://github.com/getify/You-Dont-Know-JS/blob/2nd-ed/scope-closures/ch6.md#function-boundaries)
{% endhint %}
{% endtab %}

{% tab title="👥 相關" %}

* <mark style="color:purple;">**return**</mark> is a [reserved word](/web/js/grammar/token/keyword/reserved.md).
  {% endtab %}

{% tab title="📘 手冊" %}

* [ ] [Statements and declarations](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements) ⟩ [control flow](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements#control_flow) ⟩ [return](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/return)
  {% endtab %}

{% tab title="🚧" %}

* [ ] function caller
* [x] undefined
  {% endtab %}
  {% endtabs %}
