1 files changed, 139 insertions, 0 deletions
diff --git a/files/ru/web/javascript/reference/statements/for-await...of/index.html b/files/ru/web/javascript/reference/statements/for-await...of/index.html
new file mode 100644
index 0000000000..72200e4004
--- /dev/null
+++ b/files/ru/web/javascript/reference/statements/for-await...of/index.html
@@ -0,0 +1,139 @@
+---
+title: for await...of
+slug: Web/JavaScript/Reference/Statements/for-await...of
+tags:
+  - JavaScript
+  - async
+  - Асинхронность
+  - ДжаваСкрипт
+translation_of: Web/JavaScript/Reference/Statements/for-await...of
+---
+<div>{{jsSidebar("Statements")}}</div>
+
+<p>Выражение <strong><code>for await...of</code> </strong>создаёт цикл, проходящий через асинхронные итерируемые объекты, а также синхронные итерируемые сущности, включающие: встроенные {{jsxref("String")}}, {{jsxref("Array")}}, <code>Array</code>-подобные объекты (например., {{jsxref("Functions/arguments", "arguments")}} или {{domxref("NodeList")}}), {{jsxref("TypedArray")}}, {{jsxref("Map")}}, {{jsxref("Set")}}, а также определяемые пользователем асинхронные/синхронные сущности. Он вызывает пользовательский итерационный хук с инструкциями, которые должны быть выполнены для значения каждого отдельного свойства объекта.</p>
+
+<p class="hidden">Исходный код этого интерактивного примера хранится в репозитории GitHub. Если вы хотите внести свой вклад в проект интерактивных примеров, пожалуйста, склонируйте <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> и отправьте нам пуллреквест.</p>
+
+<h2 id="Синтаксис">Синтаксис</h2>
+
+<pre class="syntaxbox">for await (<em>variable</em> of <em>iterable</em>) {
+  <em>statement
+</em>}
+</pre>
+
+<dl>
+ <dt><code>variable</code></dt>
+ <dd>На каждой итерации значение другого свойства присваивается <em>variable</em>. <em>variable</em> может быть объявлена с помощью ключевых слов <code>const</code>, <code>let</code>, or <code>var</code>.</dd>
+ <dt><code>iterable</code></dt>
+ <dd>Объект, чьи итерируемые свойства будут повторяться.</dd>
+</dl>
+
+<h3 id="Итерирование_по_асинхронным_переменным"><span style="background-color: #333333; letter-spacing: -0.00278rem;">Итерирование по асинхронным переменным</span></h3>
+
+<p>Вы также можете перебрать объект, который явно реализует асинхронный итерируемый протокол.</p>
+
+<pre class="brush:js">var asyncIterable = {
+  [Symbol.asyncIterator]() {
+    return {
+      i: 0,
+      next() {
+        if (this.i &lt; 3) {
+          return Promise.resolve({ value: this.i++, done: false });
+        }
+
+        return Promise.resolve({ done: true });
+      }
+    };
+  }
+};
+
+(async function() {
+   for await (let num of asyncIterable) {
+     console.log(num);
+   }
+})();
+
+// 0
+// 1
+// 2
+</pre>
+
+<h3 id="Итерирование_по_асинхронным_генераторам."><span style="background-color: #333333; letter-spacing: -0.00278rem;">Итерирование по асинхронным генераторам.</span></h3>
+
+<p>Поскольку асинхронные генераторы реализуют асинхронный протокол Iterator, по ним можно пройти циклом с помощью <code>for await... of</code></p>
+
+<pre class="brush: js">async function* asyncGenerator() {
+  var i = 0;
+  while (i &lt; 3) {
+    yield i++;
+  }
+}
+
+(async function() {
+  for await (let num of asyncGenerator()) {
+    console.log(num);
+  }
+})();
+// 0
+// 1
+// 2</pre>
+
+<p>Для более конкретного примера перебора асинхронного генератора с помощью <code>for await... of</code>, рассмотрим перебор данных из API.  В этом примере сначала создается асинхронный итератор для потока данных, а затем он используется для определения размера ответа от API.</p>
+
+<pre class="brush: js">async function* streamAsyncIterator(stream) {
+  const reader = stream.getReader();
+  try {
+    while (true) {
+      const { done, value } = await reader.read();
+      if (done) {
+        return;
+      }
+      yield value;
+    }
+  } finally {
+    reader.releaseLock();
+  }
+}
+// Fetches data from url and calculates response size using the async generator.
+async function getResponseSize(url) {
+  const response = await fetch(url);
+  // Will hold the size of the response, in bytes.
+  let responseSize = 0;
+  // The for-await-of loop. Async iterates over each portion of the response.
+  for await (const chunk of streamAsyncIterator(response.body)) {
+    // Incrementing the total response length.
+    responseSize += chunk.length;
+  }
+
+  console.log(`Response Size: ${responseSize} bytes`);
+  // expected output: "Response Size: 1071472"
+  return responseSize;
+}
+getResponseSize('https://jsonplaceholder.typicode.com/photos');</pre>
+
+<h2 id="Спецификации">Спецификации</h2>
+
+<table class="standard-table">
+ <tbody>
+  <tr>
+   <th scope="col">Specification</th>
+   <th scope="col">Status</th>
+   <th scope="col">Comment</th>
+  </tr>
+  <tr>
+   <td>{{SpecName('ESDraft', '#sec-for-in-and-for-of-statements', 'ECMAScript Language: The for-in, for-of, and for-await-of Statements')}}</td>
+   <td>{{Spec2('ESDraft')}}</td>
+   <td></td>
+  </tr>
+ </tbody>
+</table>
+
+<h2 id="Браузерная_совместимость">Браузерная совместимость</h2>
+
+<div class="hidden">Таблица совместимости на этой странице генерируется из структурированных данных. Если вы хотите внести свой вклад в эти данные, просмотрите https://github.com/mdn/browser-compat-data и отправьте пуллреквест. <span style="font-size: 1rem; letter-spacing: -0.00278rem;">{{Compat("javascript.statements.for_await_of")}}</span></div>
+
+<h2 id="Смотрите_также">Смотрите также</h2>
+
+<ul>
+ <li>{{jsxref("Statements/for...of")}}</li>
+</ul>