aboutsummaryrefslogtreecommitdiff
path: root/files/zh-tw/web/javascript/reference/operators/await/index.html
blob: a8bda404123c6cb9f94b4433196c6f318ed14d59 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
---
title: await
slug: Web/JavaScript/Reference/Operators/await
tags:
  - Experimental
  - JavaScript
  - 運算子
translation_of: Web/JavaScript/Reference/Operators/await
---
<div>{{jsSidebar("Operators")}}</div>

<div>await運算子可被用來等待 {{jsxref("Promise")}},只能在 {{jsxref("Statements/async_function", "async function")}}內使用。</div>

<h2 id="語法">語法</h2>

<pre class="syntaxbox">[<em>rv</em>] = await <em>expression</em>;</pre>

<dl>
 <dt><code>expression</code></dt>
 <dd>等待解析的 {{jsxref("Promise")}} 物件或任何值。</dd>
 <dt><font face="Consolas, Liberation Mono, Courier, monospace">rv = 回傳值</font></dt>
 <dd>
 <p>回傳 Promise 物件的 resolved 值,或當該值不是 Promise 物件時,回傳該值本身。</p>
 </dd>
</dl>

<h2 id="描述">描述</h2>

<p>此 await 表示法會暫停 async 函式執行,等待 Promise 物件的解析,並在 promise 物件的值被 resolve 時回復 async 函式的執行。await 接著回傳這個被 resolve 的值。如果回傳值不是一個 Promise 物件,則會被轉換為 resolved 狀態的 Promise 物件。</p>

<p>如果 Promise 物件被 rejected,則 await 會丟出 rejected 的值。</p>

<h2 id="範例">範例</h2>

<p>若將 Promise 物件傳給 await 運算式,它會等待 Promise 解析並回傳 resolve 後的值。</p>

<pre class="brush: js">function resolveAfter2Seconds(x) {
  return new Promise(resolve =&gt; {
    setTimeout(() =&gt; {
      resolve(x);
    }, 2000);
  });
}

async function f1() {
  var x = await resolveAfter2Seconds(10);
  console.log(x); // 10
}
f1();
</pre>

<p>若傳給 await 的值並非一個 Promise 物件,它會將該值轉換為 resolved Promise,並等待之。</p>

<pre class="brush: js">async function f2() {
  var y = await 20;
  console.log(y); // 20
}
f2();</pre>

<p>若 Promise 被 reject,則丟出 reject 後的異常值。</p>

<pre class="brush: js">async function f3() {
  try {
    var z = await Promise.reject(30);
  } catch(e) {
    console.log(e); // 30
  }
}
f3();</pre>

<h2 id="規範">規範</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">規範</th>
   <th scope="col">狀態</th>
   <th scope="col">註解</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('ESDraft', '#sec-async-function-definitions', 'async functions')}}</td>
   <td>{{Spec2('ESDraft')}}</td>
   <td>ES2017中初始定義</td>
  </tr>
 </tbody>
</table>

<h2 id="瀏覽器相容性">瀏覽器相容性</h2>

<div>{{CompatibilityTable}}</div>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Edge</th>
   <th>Opera</th>
   <th>Safari (WebKit)</th>
  </tr>
  <tr>
   <td>基本支援</td>
   <td>{{CompatChrome(55)}}</td>
   <td>{{CompatGeckoDesktop("52.0")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatOpera(42)}}</td>
   <td>10.1</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Feature</th>
   <th>Android</th>
   <th>Android Webview</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
   <th>Chrome for Android</th>
  </tr>
  <tr>
   <td>基本支援</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatNo}}</td>
   <td>{{CompatGeckoMobile("52.0")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatOpera(42)}}</td>
   <td>10.1</td>
   <td>{{CompatChrome(55)}}</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="See_also">See also</h2>

<ul>
 <li>{{jsxref("Statements/async_function", "async function")}}</li>
 <li>{{jsxref("Operators/async_function", "async function expression")}}</li>
 <li>{{jsxref("AsyncFunction")}} object</li>
</ul>