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
|
---
title: async function expression
slug: Web/JavaScript/Reference/Operators/async_function
translation_of: Web/JavaScript/Reference/Operators/async_function
---
<div>{{jsSidebar("Operators")}}</div>
<p>Ключевое слово <strong><code>async function</code></strong> используется для определения асинхронной функции внутри выражений.</p>
<p>Вы также можете определить асинхронные функции при помощи <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function" title="The async function keyword can be used to define async functions inside expressions.">инструкции async function</a>.</p>
<h2 id="Синтаксис">Синтаксис</h2>
<pre class="syntaxbox">async function [<em>name</em>]([<em>param1</em>[, <em>param2[</em>, ..., <em>paramN</em>]]]) {
<em>statements</em>
}</pre>
<p>Согласно спецификации <a href="https://developer.mozilla.org/en-US/docs/">ES2015</a>, вы также можете использовать <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions">стрелочные функции</a>.</p>
<h3 id="Параметры">Параметры</h3>
<dl>
<dt><code>name</code></dt>
<dd>Имя функции. Этот параметр может быть опущен, в этом случае говорят об <em>анонимной функции</em>. Имя используется только в теле функции.</dd>
<dt><code>paramN</code></dt>
<dd>Имя аргумента, передаваемого функции.</dd>
<dt><code>statements</code></dt>
<dd>Инструкции, составляющие тело функции.</dd>
</dl>
<h2 id="Описание">Описание</h2>
<p>Выражение <code>async function</code> очень похоже, и имеет почти тот же синтаксис, что и {{jsxref('Statements/async_function', 'async function statement')}}. Главное отличие между выражениями async <code>function</code> и объявлениями async <code>function</code> заключается в <em>имени функции,</em> которое может быть опущено в выражении <code>async function</code> для создания <em>анонимной</em> функции. Выражение <code>async function</code> можно использовать в виде {{Glossary("IIFE")}} (Immediately Invoked Function Expression), и оно будет запущено сразу после объявления. Смотрите также главу о <a href="/en-US/docs/Web/JavaScript/Reference/Functions">функциях</a>.</p>
<h2 id="Примеры">Примеры</h2>
<h3 id="Простой_пример">Простой пример</h3>
<pre class="brush: js">function resolveAfter2Seconds(x) {
return new Promise(resolve => {
setTimeout(() => {
resolve(x);
}, 2000);
});
};
(async function(x) { // выражение асинхронной функции в виде IIFE
var a = resolveAfter2Seconds(20);
var b = resolveAfter2Seconds(30);
return x + await a + await b;
})(10).then(v => {
console.log(v); // выведет 60 после 2 секунд.
});
var add = async function(x) { // назначение выражения асинхронной функции переменной
var a = await resolveAfter2Seconds(20);
var b = await resolveAfter2Seconds(30);
return x + a + b;
};
add(10).then(v => {
console.log(v); // выведет 60 после 4 секунд.
});
</pre>
<h2 id="Спецификации">Спецификации</h2>
<table class="standard-table">
<thead>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{SpecName('ESDraft', '#sec-async-function-definitions', 'async function')}}</td>
<td>{{Spec2('ESDraft')}}</td>
<td>Initial definition in 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>Basic support</td>
<td>{{CompatChrome(55)}}</td>
<td>{{CompatGeckoDesktop("52.0")}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatOpera(42)}}</td>
<td>{{CompatUnknown}}</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>Basic support</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile("52.0")}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatOpera(42)}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatChrome(55)}}</td>
</tr>
</tbody>
</table>
</div>
<h2 id="Смотрите_также">Смотрите также</h2>
<ul>
<li>{{jsxref("Statements/async_function", "async function")}}</li>
<li>{{jsxref("AsyncFunction")}} object</li>
<li>{{jsxref("Operators/await", "await")}}</li>
</ul>
|
