diff options
| author | Ryan Johnson <rjohnson@mozilla.com> | 2021-04-29 16:16:42 -0700 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2021-04-29 16:16:42 -0700 |
| commit | 95aca4b4d8fa62815d4bd412fff1a364f842814a (patch) | |
| tree | 5e57661720fe9058d5c7db637e764800b50f9060 /files/uk/web/javascript/reference/global_objects/promise | |
| parent | ee3b1c87e3c8e72ca130943eed260ad642246581 (diff) | |
| download | translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.tar.gz translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.tar.bz2 translated-content-95aca4b4d8fa62815d4bd412fff1a364f842814a.zip | |
remove retired locales (#699)
Diffstat (limited to 'files/uk/web/javascript/reference/global_objects/promise')
11 files changed, 0 insertions, 1665 deletions
diff --git a/files/uk/web/javascript/reference/global_objects/promise/all/index.html b/files/uk/web/javascript/reference/global_objects/promise/all/index.html deleted file mode 100644 index 156b5f499f..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/all/index.html +++ /dev/null @@ -1,232 +0,0 @@ ---- -title: Promise.all() -slug: Web/JavaScript/Reference/Global_Objects/Promise/all -tags: - - ECMAScript 2015 - - JavaScript - - Promise - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/all ---- -<div>{{JSRef}}</div> - -<p>Метод <strong><code>Promise.all()</code></strong> повертає єдиний {{jsxref("Promise","проміс")}}, який виконується, коли усі проміси, передані у вигляді ітерабельного об'єкта, були виконані, або коли ітерабельний об'єкт не містить жодного проміса. Він відхиляється з причиною першого відхиленого проміса.</p> - -<p>Зазвичай використовується після того, як були запущені асинхронні задачі, що виконуються конкурентно, та були створені проміси для їхніх результатів, щоб мати змогу зачекати, доки усі задачі не будуть виконані.</p> - -<div>{{EmbedInteractiveExample("pages/js/promise-all.html")}}</div> - -<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox">Promise.all(<var>iterable</var>);</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><code>iterable</code></dt> - <dd><a href="/uk/docs/Web/JavaScript/Reference/Протоколи_перебору#Протокол_ітерабельного_обєкта">Ітерабельний об'єкт</a>, такий як {{jsxref("Array")}}.</dd> -</dl> - -<h3 id="Значення_що_повертається">Значення, що повертається</h3> - -<ul> - <li><strong>Вже вирішений</strong> {{jsxref("Promise", "проміс")}}, якщо переданий <var>ітерабельний об'єкт</var> є порожнім.</li> - <li><strong>Асинхронно вирішений</strong> {{jsxref("Promise","проміс")}}, якщо переданий <var>ітерабельний об'єкт</var> не містить промісів. Зауважте, що Google Chrome 58 у цьому випадку повертає <strong>вже вирішений</strong> проміс.</li> - <li>{{jsxref("Promise","Проміс")}} <strong>у стані очікування</strong> у всіх інших випадках. Цей повернений проміс далі вирішується/відхиляється <strong>асинхронно</strong> (як тільки стек стане порожнім), коли усі проміси у переданому <var>ітерабельному об'єкті</var> будуть вирішені, або якщо будь-який з промісів буде відхилено. Дивіться приклад щодо "Асинхронності або синхронності Promise.all" нижче. Повернені значення будуть розташовані у порядку, в якому були передані проміси, незалежно від порядку завершення.</li> -</ul> - -<h2 id="Опис">Опис</h2> - -<p>Цей метод може бути корисним для збирання результатів множини промісів.</p> - -<h3 id="Виконання">Виконання</h3> - -<p>Повернений проміс виконується з масивом, що містить <strong>усі </strong>значення <var>ітерабельного об'єкта,</var> переданого в якості аргумента (також значення, що не є промісами).</p> - -<ul> - <li>Якщо був переданий порожній <var>ітерабельний об'єкт</var>, тоді цей метод вертає (синхронно) вже вирішений проміс.</li> - <li>Якщо усі передані проміси виконуються, або це не проміси, проміс, повернений <code>Promise.all</code>, виконується асинхронно.</li> -</ul> - -<h3 id="Відхилення">Відхилення</h3> - -<p>Якщо будь-який з переданих промісів відхиляється, <code>Promise.all</code> асинхронно відхиляється зі значенням відхиленого проміса, незалежно від того, чи були вирішені інші проміси.</p> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="Використання_Promise.all">Використання <code>Promise.all</code></h3> - -<p><code>Promise.all</code> чекає на усі виконання (або на перше відхилення).</p> - -<pre class="brush: js">var p1 = Promise.resolve(3); -var p2 = 1337; -var p3 = new Promise((resolve, reject) => { - setTimeout(() => { - resolve("foo"); - }, 100); -}); - -Promise.all([p1, p2, p3]).then(values => { - console.log(values); // [3, 1337, "foo"] -});</pre> - -<p>Якщо <var>ітерабельний об'єкт</var> містить значення, що не є промісами, вони будуть проігноровані, але все одно міститимуться у поверненому масиві проміса (якщо проміс виконається):</p> - -<pre class="brush: js">// рахуватиметься, ніби передано порожній ітерабельний об'єкт, отже, він виконається -var p = Promise.all([1,2,3]); -// рахуватиметься, ніби переданий ітерабельний об'єкт містить лише вирішений проміс зі значенням "444", отже, він виконається -var p2 = Promise.all([1,2,3, Promise.resolve(444)]); -// рахуватиметься, ніби переданий ітерабельний об'єкт містить лише відхилений проміс зі значенням "555", отже, він буде відхилений -var p3 = Promise.all([1,2,3, Promise.reject(555)]); - -// використовуючи setTimeout, ми можемо виконати код після того, як стек стане порожнім -setTimeout(function() { - console.log(p); - console.log(p2); - console.log(p3); -}); - -// виводить -// Promise { <state>: "fulfilled", <value>: Array[3] } -// Promise { <state>: "fulfilled", <value>: Array[4] } -// Promise { <state>: "rejected", <reason>: 555 }</pre> - -<h3 id="Асинхронність_або_синхронність_Promise.all">Асинхронність або синхронність <code>Promise.all</code></h3> - -<p>Наступний приклад демонструє асинхронність (або синхронність, якщо передано порожній <var>ітерабельний об'єкт</var>) <code>Promise.all</code>:</p> - -<pre class="brush: js">// ми передаємо в якості аргумента масив вже вирішених промісів, -// щоб запустити Promise.all якомога швидше -var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)]; - -var p = Promise.all(resolvedPromisesArray); -// негайно виводимо значення p -console.log(p); - -// використовуючи setTimeout, ми можемо виконати код після того, як стек стане порожнім -setTimeout(function() { - console.log('стек тепер порожній'); - console.log(p); -}); - -// виводить, в порядку: -// Promise { <state>: "pending" } -// стек тепер порожній -// Promise { <state>: "fulfilled", <value>: Array[2] } -</pre> - -<p>Те саме відбувається, якщо <code>Promise.all</code> відхиляється:</p> - -<pre class="brush: js">var mixedPromisesArray = [Promise.resolve(33), Promise.reject(44)]; -var p = Promise.all(mixedPromisesArray); -console.log(p); -setTimeout(function() { - console.log('стек тепер порожній'); - console.log(p); -}); - -// виводить -// Promise { <state>: "pending" } -// стек тепер порожній -// Promise { <state>: "rejected", <reason>: 44 } -</pre> - -<p><code>Promise.all</code> вирішується синхронно <strong>лише тоді</strong>, коли переданий <var>ітерабельний об'єкт</var> є порожнім:</p> - -<pre class="brush: js">var p = Promise.all([]); // буде негайно вирішений -// значення, що не є промісами, будуть проігноровані, але обчислення відбуватиметься асинхронно -var p2 = Promise.all([1337, "привіт"]); -console.log(p); -console.log(p2) -setTimeout(function() { - console.log('стек тепер порожній'); - console.log(p2); -}); - -// виводить -// Promise { <state>: "fulfilled", <value>: Array[0] } -// Promise { <state>: "pending" } -// стек тепер порожній -// Promise { <state>: "fulfilled", <value>: Array[2] }</pre> - -<h3 id="Швидке_відхилення_у_Promise.all">Швидке відхилення у <code>Promise.all</code></h3> - -<p><code>Promise.all</code> відхиляється, якщо будь-який з його елементів було відхилено. Наприклад, якщо ви передаєте чотири проміси, які вирішуються після затримки, та один проміс, який негайно відхиляється, тоді <code>Promise.all</code> буде негайно відхилено.</p> - -<pre class="brush: js">var p1 = new Promise((resolve, reject) => { - setTimeout(() => resolve('один'), 1000); -}); -var p2 = new Promise((resolve, reject) => { - setTimeout(() => resolve('два'), 2000); -}); -var p3 = new Promise((resolve, reject) => { - setTimeout(() => resolve('три'), 3000); -}); -var p4 = new Promise((resolve, reject) => { - setTimeout(() => resolve('чотири'), 4000); -}); -var p5 = new Promise((resolve, reject) => { - reject(new Error('відхилено')); -}); - - -// Використовуємо .catch: -Promise.all([p1, p2, p3, p4, p5]) -.then(values => { - console.log(values); -}) -.catch(error => { - console.error(error.message) -}); - -//Виведе: -//"відхилено" - -</pre> - -<p>Цю поведінку можливо змінити, обробивши можливі відхилення:</p> - -<pre class="brush: js">var p1 = new Promise((resolve, reject) => { - setTimeout(() => resolve('p1_відкладене_вирішення'), 1000); -}); - -var p2 = new Promise((resolve, reject) => { - reject(new Error('p2_негайне_відхилення')); -}); - -Promise.all([ - p1.catch(error => { return error }), - p2.catch(error => { return error }), -]).then(values => { - console.log(values[0]) // "p1_відкладене_вирішення" - console.error(values[1]) // "Error: p2_негайне_відхилення" -}) -</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise.all', 'Promise.all')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> - -<p>{{Compat("javascript.builtins.Promise.all")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li>{{jsxref("Promise")}}</li> - <li>{{jsxref("Promise.race()")}}</li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/allsettled/index.html b/files/uk/web/javascript/reference/global_objects/promise/allsettled/index.html deleted file mode 100644 index 98b87dd1e8..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/allsettled/index.html +++ /dev/null @@ -1,61 +0,0 @@ ---- -title: Promise.allSettled() -slug: Web/JavaScript/Reference/Global_Objects/Promise/allSettled -tags: - - JavaScript - - Promise - - allSettled - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/allSettled ---- -<p>{{JSRef}}</p> - -<p>Метод <code><strong>Promise.allSettled()</strong></code> повертає проміс, який вирішується після того, як усі надані проміси були або вирішені, або відхилені, з масивом об'єктів, що містять результат кожного проміса.</p> - -<div>{{EmbedInteractiveExample("pages/js/promise-allsettled.html")}}</div> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox"><em>Promise</em>.allSettled(<em>iterable</em>);</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><code>iterable</code></dt> - <dd><a href="/uk/docs/Web/JavaScript/Reference/Протоколи_перебору#Протокол_ітерабельного_обєкта">Ітерабельний об'єкт</a>, такий, як {{jsxref("Array")}}, кожен елемент якого є об'єктом <code>Promise</code>.</dd> -</dl> - -<h3 id="Значення_що_повертається">Значення, що повертається</h3> - -<p>{{jsxref("Promise")}} у стані <strong>очікування</strong>, який буде <strong>асинхронно</strong> виконаний, як тільки кожен проміс у вказаному наборі промісів буде завершений, або успішним виконанням, або будучи відхиленим. В цей момент обробнику поверненого проміса передається масив, що містить результат для кожного проміса з початкового набору промісів.</p> - -<p>У кожного об'єкта результату присутній рядок <code>status</code> (статус). Якщо статус дорівнює <code>fulfilled</code> (виконаний), тоді присутній параметр <code>value</code> (значення). Якщо статус дорівнює <code>rejected</code> (відхилений), тоді присутній параметр <code>reason</code> (причина). Значення (або причина) відображає значення, з яким кожен проміс був виконаний (або відхилений).</p> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td><a href="https://tc39.es/proposal-promise-allSettled/#sec-promise.allsettled"><code>Promise.allSettled()</code> (TC39 Stage 4 Draft)</a></td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> - -<p>{{Compat("javascript.builtins.Promise.allSettled")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li><a href="/uk/docs/Archive/Add-ons/Techniques/Promises">Проміси</a></li> - <li><a href="/uk/docs/Web/JavaScript/Guide/Using_promises">Використання промісів</a></li> - <li><a href="/uk/docs/Learn/JavaScript/Asynchronous/Promises">Витончене асинхронне програмування за допомогою промісів</a></li> - <li>{{jsxref("Promise")}}</li> - <li>{{jsxref("Promise.all()")}}</li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/any/index.html b/files/uk/web/javascript/reference/global_objects/promise/any/index.html deleted file mode 100644 index 3e450db558..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/any/index.html +++ /dev/null @@ -1,86 +0,0 @@ ---- -title: Promise.any() -slug: Web/JavaScript/Reference/Global_Objects/Promise/any -tags: - - JavaScript - - Promise - - Експериментальний - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/any ---- -<div>{{JSRef}}</div> - -<p><code>Promise.any()</code> приймає ітерабельний об'єкт з об'єктами {{JSxRef("Promise")}} та, як тільки один з промісів виконується, вертає єдиний проміс, який вирішується зі значенням цього проміса. Якщо жодний проміс не виконався (якщо усі надані проміси були відхилені), тоді повернений проміс буде відхилено з об'єктом, який досі є предметом обговорення: або масив причин відхилення, або {{JSxRef("AggregateError")}}, новий підклас {{JSxRef("Error")}}, який поєднує окремі помилки. Найголовніше, цей метод є протилежністю методу {{JSxRef("Promise.all()")}}.</p> - -<div class="blockIndicator warning"> -<p><strong>Застереження!</strong> Метод <code>Promise.any()</code> є експериментальним та не повністю підтримується усіма переглядачами. Він наразі на стадії <a href="https://github.com/tc39/proposal-promise-any" rel="external">TC39 Candidate stage (стадія 3)</a>.</p> -</div> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre>Promise.any(<var>iterable</var>);</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><code>iterable</code></dt> - <dd><a href="/uk/docs/Web/JavaScript/Reference/Протоколи_перебору#Протокол_ітерабельного_обєкта">Ітерабельний об'єкт</a>, такий як {{JSxRef("Array")}}.</dd> -</dl> - -<h3 id="Значення_що_повертається">Значення, що повертається</h3> - -<ul> - <li><strong>Вже вирішений</strong> {{JSxRef("Promise","проміс")}}, якщо переданий <var>ітерабельний об'єкт</var> є порожнім.</li> - <li><strong>Асинхронно вирішений</strong> {{JSxRef("Promise","проміс")}}, якщо переданий <var>ітерабельний об'єкт</var> не містить промісів.</li> - <li>{{JSxRef("Promise","Проміс")}} <strong>у стані очікування</strong> у всіх інших випадках. Цей повернений проміс далі вирішується/відхиляється <strong>асинхронно</strong> (як тільки стек стане порожнім), коли будь-який з промісів у переданому <var>ітерабельному об'єкті</var> буде вирішено, або якщо усі проміси буде відхилено.</li> -</ul> - -<h2 id="Опис">Опис</h2> - -<p>Цей метод корисний для повернення першого проміса, який виконується. Він завершується після виконання проміса, тому не очікує на завершення інших промісів, як тільки його знаходить. На відміну від {{JSxRef("Promise.all()")}}, який вертає <em>масив</em> вирішених значень, ми отримуємо лише одне вирішене значення (за умови, що принаймні один проміс вирішується). Це може бути вигідно, якщо нам потрібно, щоб лише один проміс було вирішено, і нам байдуже, який саме. Також, на відміну від {{JSxRef("Promise.race()")}}, який вертає перше <em>встановлене</em> значення, цей метод вертає перше <em>вирішене</em> значення. Цей метод ігноруватиме усі відхилені проміси до першого вирішеного проміса.</p> - -<h3 id="Виконання">Виконання</h3> - -<p>Якщо будь-який з переданих промісів виконається, повернений проміс асинхронно виконується зі значенням виконаного проміса, незалежно від того, чи були інші проміси виконані чи відхилені.</p> - -<ul> - <li>Якщо був переданий порожній <var>ітерабельний об'єкт</var>, тоді цей метод вертає (синхронно) вже вирішений проміс.</li> - <li>Якщо будь-який з переданих промісів виконується, або передано не проміси, проміс, повернений <code>Promise.any</code> виконується асинхронно.</li> -</ul> - -<h3 id="Відхилення">Відхилення</h3> - -<p>Якщо усі передані проміси було відхилено, <code>Promise.any</code> асинхронно відхиляється з одним з двох варіантів (щодо яких ще не дійшли згоди): </p> - -<ul> - <li>масив, що містить <strong>усі </strong>причини відхилень <var>ітерабельного об'єкта</var>, переданого в якості аргумента, або</li> - <li>об'єкт {{JSxRef("AggregateError")}}, що розширює {{JSxRef("Error")}} та містить вказівник на масив винятків.</li> -</ul> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td><a href="https://tc39.es/proposal-promise-any/#sec-promise.any">ESNext Promise.any Proposal</a></td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - - - -<p>{{Compat("javascript.builtins.Promise.any")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li>{{JSxRef("Promise")}}</li> - <li>{{JSxRef("Promise.allSettled()")}}</li> - <li>{{JSxRef("Promise.all()")}}</li> - <li>{{JSxRef("Promise.race()")}}</li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/catch/index.html b/files/uk/web/javascript/reference/global_objects/promise/catch/index.html deleted file mode 100644 index 7e84771513..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/catch/index.html +++ /dev/null @@ -1,189 +0,0 @@ ---- -title: Promise.prototype.catch() -slug: Web/JavaScript/Reference/Global_Objects/Promise/catch -tags: - - ECMAScript 2015 - - JavaScript - - Promise - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/catch ---- -<div>{{JSRef}}</div> - -<p>Метод <code><strong>catch()</strong></code> вертає {{jsxref("Promise","проміс")}} та має справу лише з відхиленнями. Він поводиться так само, як виклик {{jsxref("Promise.then", "Promise.prototype.then(undefined, onRejected)")}} (насправді, <code>obj.catch(onRejected)</code> здійснює внутрішній виклик <code>obj.then(undefined, onRejected)</code>). Це означає, що ви маєте надати функцію <code>onRejected</code>, навіть якщо хочете отримати повернене значення <code>undefined</code> - наприклад, <code>obj.catch(() => {})</code>.</p> - -<div>{{EmbedInteractiveExample("pages/js/promise-catch.html")}}</div> - - - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox"><var>p</var>.catch(<var>onRejected</var>); - -p.catch(function(<var>reason</var>) { - // відхилення -}); -</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><code><var>onRejected</var></code></dt> - <dd>{{jsxref("Function","Функція")}}, що викликається, коли об'єкт <code>Promise</code> відхилено. Ця функція має один аргумент: - <dl> - <dt><code><var>reason</var></code></dt> - <dd>Причина відхилення.</dd> - </dl> - Проміс, повернений методом <code>catch()</code>, відхиляється, якщо <code>onRejected</code> викидає помилку або повертає проміс, що сам є відхиленим; інакше, він вирішується.</dd> -</dl> - -<h3 id="Значення_що_повертається">Значення, що повертається</h3> - -<p>Здійснює внутрішній виклик <code>Promise.prototype.then</code> на об'єкті, на якому був викликаний, передаючи параметри <code>undefined</code> та отриманий обробник <code>onRejected</code>. Повертає значення цього виклику, тобто, {{jsxref("Promise")}}.</p> - -<div class="warning"> -<p>Зауважте, що наведені нижче приклади викидають екземпляри <a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Error">Error</a>. Це вважається гарною практикою у порівнянні з викиданням рядків: Інакше та частина, що здійснює перехоплення, була б змушена робити перевірки, щоб дізнатись, чи є аргумент рядком, чи помилкою, і ви могли б втратити цінну інформацію, таку як траси стеків.</p> -</div> - -<p><strong>Демонстрація внутрішнього виклику:</strong></p> - -<pre class="brush: js">// заміщуємо початковий Promise.prototype.then/catch, щоб додати трохи логів -(function(Promise){ - var originalThen = Promise.prototype.then; - var originalCatch = Promise.prototype.catch; - - Promise.prototype.then = function(){ - console.log('> > > > > > викликано .then на %o з аргументами: %o', this, arguments); - return originalThen.apply(this, arguments); - }; - Promise.prototype.catch = function(){ - console.error('> > > > > > викликано .catch на %o з аргументами: %o', this, arguments); - return originalCatch.apply(this, arguments); - }; - -})(this.Promise); - - - -// викликаємо catch на вже вирішеному промісі -Promise.resolve().catch(function XXX(){}); - -// виводить: -// > > > > > > викликано .catch на Promise{} з аргументами: Arguments{1} [0: function XXX()] -// > > > > > > викликано .then на Promise{} з аргументами: Arguments{2} [0: undefined, 1: function XXX()] -</pre> - -<h2 id="Опис">Опис</h2> - -<p>Метод <code>catch</code> використовується для обробки помилок у композиції промісів. Оскільки він вертає {{jsxref("Promise","проміс")}}, його <a href="/uk/docs/Web/JavaScript/Guide/Using_promises#Chaining_after_a_catch">можна додавати в ланцюги</a> так само, як метод {{jsxref("Promise.then", "then()")}}.</p> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="Використання_та_ланцюгування_метода_catch">Використання та ланцюгування метода <code>catch</code></h3> - -<pre class="brush: js">var p1 = new Promise(function(resolve, reject) { - resolve('Успіх!'); -}); - -p1.then(function(value) { - console.log(value); // "Успіх!" - throw new Error('о, ні!'); -}).catch(function(e) { - console.error(e.message); // "о, ні!" -}).then(function(){ - console.log('після catch ланцюг відновлено'); -}, function () { - console.log('Не запуститься через catch'); -}); - -// Наступний код поводиться так само -p1.then(function(value) { - console.log(value); // "Успіх!" - return Promise.reject('о, ні!'); -}).catch(function(e) { - console.error(e); // "о, ні!" -}).then(function(){ - console.log('після catch ланцюг відновлено'); -}, function () { - console.log('Не запуститься через catch'); -}); -</pre> - -<h3 id="Підводні_камені_при_викиданні_помилок">Підводні камені при викиданні помилок</h3> - -<pre class="brush: js">// Викидання помилок викличе метод catch у більшості випадків -var p1 = new Promise(function(resolve, reject) { - throw new Error('Ой-ой!'); -}); - -p1.catch(function(e) { - console.error(e); // "Ой-ой!" -}); - -// Помилки, викинуті всередині асинхронних функцій, поводитимуться, як неперехоплені -var p2 = new Promise(function(resolve, reject) { - setTimeout(function() { - throw new Error('Неперехоплений виняток!'); - }, 1000); -}); - -p2.catch(function(e) { - console.error(e); // Це ніколи не виконається -}); - -// Помилки, викинуті після виклику resolve, глушаться -var p3 = new Promise(function(resolve, reject) { - resolve(); - throw new Error('Заглушений виняток!'); -}); - -p3.catch(function(e) { - console.error(e); // Це ніколи не виконається -});</pre> - -<h3 id="Якщо_він_вирішений">Якщо він вирішений</h3> - -<pre class="brush: js">//Створюємо проміс, що не викличе onReject -var p1 = Promise.resolve("виклик наступного"); - -var p2 = p1.catch(function (reason) { - //Це ніколи не буде викликано - console.error("перехоплено p1!"); - console.error(reason); -}); - -p2.then(function (value) { - console.log("onFulfilled наступного проміса"); /* onFulfilled наступного проміса */ - console.log(value); /* виклик наступного */ -}, function (reason) { - console.log("onRejected наступного проміса"); - console.log(reason); -});</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Специфікація</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise.prototype.catch', 'Promise.prototype.catch')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> - -<p>{{Compat("javascript.builtins.Promise.catch")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li>{{jsxref("Promise")}}</li> - <li>{{jsxref("Promise.prototype.then()")}}</li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/finally/index.html b/files/uk/web/javascript/reference/global_objects/promise/finally/index.html deleted file mode 100644 index f67c7fb1e3..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/finally/index.html +++ /dev/null @@ -1,103 +0,0 @@ ---- -title: Promise.prototype.finally() -slug: Web/JavaScript/Reference/Global_Objects/Promise/finally -tags: - - JavaScript - - Promise - - finally - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/finally ---- -<div>{{JSRef}}</div> - -<p>Метод <code><strong>finally()</strong></code> вертає {{jsxref("Promise")}}. Коли проміс встановлено, тобто, або виконано, або відхилено, виконується вказана функція зворотного виклику. Це надає можливість виконати код незалежно від того, чи був проміс успішно виконаний, чи відхилений, як тільки проміс було оброблено.</p> - -<p>Це допомагає уникати дублювання коду у обробниках проміса {{jsxref("Promise.then", "then()")}} та {{jsxref("Promise.catch", "catch()")}}.</p> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox"><var>p.finally(onFinally)</var>; - -p.finally(function() { - // встановлений (виконаний або відхилений) -}); -</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><code>onFinally</code></dt> - <dd>{{jsxref("Function", "Функція")}}, що викликається, коли <code>Promise</code> встановлений.</dd> -</dl> - -<h3 id="Значення_що_повертається">Значення, що повертається</h3> - -<p>Вертає {{jsxref("Promise","проміс")}}, чиєму обробнику <code>finally</code> присвоєна вказана функція <code>onFinally</code>.</p> - -<h2 id="Опис">Опис</h2> - -<p>Метод <code>finally()</code> може бути корисним, якщо ви хочете виконати певну обробку або прибирання, як тільки проміс встановлено, незалежно від результату.</p> - -<p>Метод <code>finally()</code> дуже схожий на виклик <code>.then(onFinally, onFinally)</code>, але є пара відмінностей:</p> - -<ul> - <li>Створюючи вбудовану функцію, ви можете передати її один раз, замість того, щоб або оголошувати її двічі, або створювати для неї змінну</li> - <li>Зворотній виклик <code>finally</code> не отримує жодних аргументів, оскільки не існує надійних методів визначити, чи був проміс виконаний, чи відхилений. Цей випадок використання розрахований саме на те, що вам <em>неважлива</em> причина відхилення чи повернене значення, і тому немає необхідності їх надавати. Отже, для прикладу: - <ul> - <li>На відміну від <code>Promise.resolve(2).then(() => {}, () => {})</code> (який буде вирішений з <code>undefined</code>), <code>Promise.resolve(2).finally(() => {})</code> буде вирішений з <code>2</code>.</li> - <li>Також, на відміну від <code>Promise.reject(3).then(() => {}, () => {})</code> (який буде виконаний з <code>undefined</code>), <code>Promise.reject(3).finally(() => {})</code> буде відхилений з <code>3</code>.</li> - </ul> - </li> -</ul> - -<div class="note"> -<p><strong>Заувага:</strong> <code>throw</code> (або повернення відхиленого проміса) у зворотному виклику <code>finally</code> відхилить новий проміс з причиною відхилення, вказаною у виклику <code>throw</code>.</p> -</div> - -<h2 id="Приклади">Приклади</h2> - -<pre class="brush: js">let isLoading = true; - -fetch(myRequest).then(function(response) { - var contentType = response.headers.get("content-type"); - if(contentType && contentType.includes("application/json")) { - return response.json(); - } - throw new TypeError("От халепа, немає JSON!"); - }) - .then(function(json) { /* обробити JSON далі */ }) - .catch(function(error) { console.error(error); /* цей рядок може викинути помилку, наприклад, якщо console = {} */ }) - .finally(function() { isLoading = false; }); - -</pre> - -<div class="hidden"> -<p>Будь ласка, не додавайте поліфіли у статті MDN. Більше інформації дивіться за посиланням: <a href="https://discourse.mozilla.org/t/mdn-rfc-001-mdn-wiki-pages-shouldnt-be-a-distributor-of-polyfills/24500">https://discourse.mozilla.org/t/mdn-rfc-001-mdn-wiki-pages-shouldnt-be-a-distributor-of-polyfills/24500</a></p> -</div> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise.prototype.finally', 'Promise.prototype.finally')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> - -<p>{{Compat("javascript.builtins.Promise.finally")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li>{{jsxref("Promise")}}</li> - <li>{{jsxref("Promise.prototype.then()")}}</li> - <li>{{jsxref("Promise.prototype.catch()")}}</li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/index.html b/files/uk/web/javascript/reference/global_objects/promise/index.html deleted file mode 100644 index 1f18c8bd76..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/index.html +++ /dev/null @@ -1,232 +0,0 @@ ---- -title: Promise -slug: Web/JavaScript/Reference/Global_Objects/Promise -tags: - - ECMAScript 2015 - - JavaScript - - Promise -translation_of: Web/JavaScript/Reference/Global_Objects/Promise ---- -<div>{{JSRef}}</div> - -<p>Об'єкт <strong><code>Promise</code></strong> відображає остаточне завершення (або неуспіх) асинхронної операції та значення, яке вона повертає.</p> - -<p>Щоб дізнатись, як працюють проміси та як їх можна використовувати, радимо вам спочатку прочитати статтю <a href="/uk/docs/Web/JavaScript/Guide/Using_promises">Використання промісів</a>.</p> - -<h2 id="Опис">Опис</h2> - -<p><code><strong>Promise</strong></code> - це проксі для значення, яке може бути невідомим на момент створення проміса. Це дозволяє зв'язувати обробники з кінцевим успішним значенням чи причиною неуспіху асинхронних дій. Таким чином, асинхронні методи повертають значення, як синхронні методи: замість того, щоб негайно повернути кінцеве значення, асинхронний метод повертає <em>проміс</em>, щоб надати значення в певний момент у майбутньому.</p> - -<p>Об'єкт <code>Promise</code> може знаходитись в одному з цих станів:</p> - -<ul> - <li><em>pending (у стані очікування)</em>: початковий стан, ані виконаний, ані відхилений.</li> - <li><em>fulfilled (виконаний)</em>: означає, що операція завершилася вдало.</li> - <li><em>rejected (відхилений)</em>: означає, що операція була неуспішною.</li> -</ul> - -<p>Проміс у стані очікування може стати або виконаним (<em>fulfilled</em>) з певним значенням, або відхиленим (<em>rejected</em>) з причиною відхилення (помилкою). Коли щось із цього відбувається, викликаються відповідні обробники, що ставляться в чергу методом об'єкта <code>then</code>. (Якщо проміс вже був виконаний чи відхилений ще до моменту приєднання відповідного обробника, то обробник буде викликаний, таким чином не відбувається "стану гонки" між завершенням асинхронної операції та приєднанням її обробників)</p> - -<p>Оскільки методи <code>{{jsxref("Promise.then", "Promise.prototype.then()")}}</code> та <code>{{jsxref("Promise.catch", "Promise.prototype.catch()")}}</code> повертають проміси, їх можна з'єднувати в ланцюжки.</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/17088/promises.png" style="height: 297px; width: 801px;"></p> - -<div class="note"> -<p><strong>Не варто плутати з</strong><span lang="uk"><span><strong>:</strong> Декілька інших мов мають механізми лінивих обчислень та відкладених розрахунків, які також називаються "promises" - наприклад,</span> Scheme. <span>Проміси у JavaScript відображають процеси, які вже відбуваються і які можуть бути з'єднані в ланцюги з функціями зворотного виклику.</span> <span>Якщо вам потрібне ліниве обчислення виразу, розгляньте </span></span><a href="/uk/docs/Web/JavaScript/Reference/Functions/Стрілкові_функції">стрілкові функції</a><span lang="uk"><span> без аргументів: <code>f = () => вираз</code> для створення лінивого виразу, та <code>f()</code> для обчислення.</span></span></p> -</div> - -<div class="note"> -<p><strong>Заувага</strong>: Проміс називають <em>встановленим</em> (<em>settled)</em>, якщо він або виконаний, або відхилений, але не знаходиться у стані очікування. Ви також почуєте термін <em>вирішений</em> (<em>resolved</em>) щодо промісів - він означає, що проміс встановлений, або ж "зафіксований", щоб відповідати стану іншого проміса. Стаття <a href="https://github.com/domenic/promises-unwrapping/blob/master/docs/states-and-fates.md">States and Fates</a> містить більше подробиць щодо термінології промісів.</p> -</div> - -<h2 id="Конструктор">Конструктор</h2> - -<dl> - <dt><code><a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Promise/Promise">Promise()</a></code></dt> - <dd>Конструктор переважно використовується для загортання функцій, які самі не підтримують проміси.</dd> -</dl> - -<h2 id="Властивості">Властивості</h2> - -<dl> - <dt><code>Promise.length</code></dt> - <dd><span id="result_box" lang="uk"><span>Значення довжини, завжди дорівнює 1 (кількість аргументів конструктора)</span></span>.</dd> - <dt><code>Promise.prototype</code></dt> - <dd>Прототип для конструктора <code>Promise</code>.</dd> -</dl> - -<h2 id="Методи">Методи</h2> - -<dl> - <dt>{{jsxref("Promise.all", "Promise.all(iterable)")}}</dt> - <dd>Чекає, доки усі проміси не будуть вирішені, або поки будь-який з промісів не буде відхилений.</dd> - <dd><span id="result_box" lang="uk"><span>Якщо повернений проміс вирішується, він вирішується із сукупним масивом значень вирішених промісів, у тому ж порядку, в якому вони визначені в ітерабельному об'єкті промісів.</span> </span></dd> - <dd><span lang="uk"><span>В разі відхилення, він відхиляється з причиною з першого відхиленого проміса у ітерабельному об'єкті.</span></span></dd> - <dt>{{JSxRef("Promise.allSettled", "Promise.allSettled(iterable)")}}</dt> - <dd>Чекає, доки усі проміси не будуть встановлені (кожен має бути або вирішений, або відхилений).</dd> - <dd>Повертає проміс, який вирішується після того, як усі надані проміси були або вирішені, або відхилені, з масивом об'єктів, які описують результат кожного проміса.</dd> - <dt>{{jsxref("Promise.race", "Promise.race(iterable)")}}</dt> - <dd>Чекає, доки будь-який з промісів не буде або вирішений, або відхилений.</dd> - <dd>Якщо повернений проміс вирішений, він вирішується зі значенням першого проміса з ітерабельного об'єкта, який був вирішений.</dd> - <dd><span id="result_box" lang="uk"><span>Якщо він відхилений, він відхиляється з причиною першого відхиленого проміса.</span></span></dd> -</dl> - -<dl> - <dt>{{jsxref("Promise.відхилено", "Promise.reject(reason)")}}</dt> - <dd>Повертає новий об'єкт <code>Promise</code>, відхилений з наданою причиною.</dd> -</dl> - -<dl> - <dt>{{jsxref("Promise.resolve", "Promise.resolve(value)")}}</dt> - <dd><span id="result_box" lang="uk"><span>Повертає новий об'єкт <code>Promise</code>, який вирішується з наданим значенням.</span> <span>Якщо значенням є промісоподібний об'єкт (такий, що має метод <code>then</code>), то повернений проміс буде його "дотримуватись", приймаючи його кінцевий стан; у іншому випадку повернений проміс буде виконаний з наданим значенням</span><span>.</span></span></dd> - <dd>Загалом, якщо ви не знаєте, є значення промісом чи ні, використайте {{JSxRef("Promise.resolve", "Promise.resolve(value)")}} та працюйте з поверненим значенням як з промісом.</dd> -</dl> - -<h2 id="Прототип_Promise">Прототип Promise</h2> - -<h3 id="Властивості_2">Властивості</h3> - -<dl> - <dt><code>Promise.prototype.constructor</code></dt> - <dd>Вертає функцію, яка створила прототип екземпляра. Це за замовчуванням функція {{jsxref("Promise")}}.</dd> -</dl> - -<h3 id="Методи_2">Методи</h3> - -<dl> - <dt>{{jsxref("Promise.prototype.catch()")}}</dt> - <dd>Додає до проміса функцію зворотного виклику для обробки відхилення та вертає новий проміс, що вирішується з поверненим значенням цієї функції, коли вона викликається, або з початковим значенням виконання, якщо проміс, навпаки, виконається.</dd> - <dt>{{jsxref("Promise.prototype.then()")}}</dt> - <dd>Додає до проміса обробники виконання та відхилення та вертає новий проміс, що вирішується з поверненим значенням обробника, який викликався, або з початковим встановленим значенням, якщо проміс не оброблявся (тобто, якщо відповідний обробник <code>onFulfilled</code> чи <code>onRejected</code> не є функцією).</dd> - <dt>{{jsxref("Promise.prototype.finally()")}}</dt> - <dd>Додає до проміса обробник та вертає новий проміс, який вирішується, коли вирішується початковий проміс. Обробник викликається, коли проміс встановлений, тобто, або виконаний, або відхилений.</dd> -</dl> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="Базовий_приклад">Базовий приклад</h3> - -<pre class="brush: js">let myFirstPromise = new Promise((resolve, reject) => { - // Викликаємо resolve(...), коли те, що ми робили асинхронно, успішно виконалось, і reject(...), якщо неуспішно. - // В цьому прикладі ми використовуємо setTimeout(...) для симуляції асинхронного коду. - // В житті ви, ймовірно, використовуватиме щось на кшталт XHR або HTML5 API. - setTimeout( function() { - resolve("Успіх!") // Є! Все пройшло добре! - }, 250) -}) - -myFirstPromise.then((successMessage) => { - // successMessage - це те, що ми передаємо у наведену вище функцію resolve(...). - // Це не обов'язково має бути рядок, але, якщо це повідомлення про успіх, то, мабуть, це буде він. - console.log("Є! " + successMessage) -});</pre> - -<h3 id="Ускладнений_приклад">Ускладнений приклад</h3> - -<div class="hidden"> -<pre class="brush: html"><button id="btn">Зробити проміс!</button> -<div id="log"></div></pre> -</div> - -<p>Цей маленький приклад демонструє механізм об'єкта <code>Promise</code>. Метод <code>testPromise()</code> викликається кожний раз, коли натискається кнопка <a href="/uk/docs/Web/HTML/Element/button" title="The HTML <button> element represents a clickable button, used to submit forms or anywhere in a document for accessible, standard button functionality."><code><button></code></a>. Він створює проміс, який буде виконаний з використанням <a href="/uk/docs/Web/API/Window/setTimeout" title="REDIRECT WindowTimers.setTimeout"><code>window.setTimeout()</code></a> з лічильником проміса (число, що стартує від 1) кожні 1-3 секунди, у випадковому порядку. Конструктор <code>Promise()</code> використовується для створення проміса.</p> - -<p>Виконання проміса логується просто, виконанням зворотного виклику через {{jsxref("Promise.prototype.then()","p1.then()")}}. Кілька логів демонструють, як синхронна частина методу відокремлюється від асинхронного завершення проміса.</p> - -<pre class="brush: js">'use strict'; -var promiseCount = 0; - -function testPromise() { - var thisPromiseCount = ++promiseCount; - - var log = document.getElementById('log'); - log.insertAdjacentHTML('beforeend', thisPromiseCount + - ') Запуск (<small>Синхронний код запущено</small>)<br/>'); - - // Створюємо новий проміс: ми передаємо лічильник цього проміса, починаючи з 1 (після очікування 3с) - var p1 = new Promise( - // Функція вирішення викликається з можливістю вирішити або - // відхилити проміс - function(resolve, reject) { - log.insertAdjacentHTML('beforeend', thisPromiseCount + - ') Запуск проміса (<small>Асинхронний код запущено</small>)<br/>'); - // Це лише приклад для створення асинхронності - window.setTimeout( - function() { - // Ми виконуємо проміс! - resolve(thisPromiseCount); - }, Math.random() * 2000 + 1000); - } - ); - - // Визначаємо, що робити, коли проміс вирішено/виконано, викликом then(), - // а метод catch() визначає, що робити, якщо проміс відхилено. - p1.then( - // Залогувати значення виконання - function(val) { - log.insertAdjacentHTML('beforeend', val + - ') Проміс виконано (<small>Асинхронний код завершений</small>)<br/>'); - }) - .catch( - // Залогувати причину відхилення - function(reason) { - console.log('Обробити тут відхилений проміс ('+reason+').'); - }); - - log.insertAdjacentHTML('beforeend', thisPromiseCount + - ') Проміс створено (<small>Синхронний код завершений</small>)<br/>'); -} -</pre> - -<div class="hidden"> -<pre class="brush: js">if ("Promise" in window) { - var btn = document.getElementById("btn"); - btn.addEventListener("click",testPromise); -} else { - log = document.getElementById('log'); - log.innerHTML = "Живий приклад недоступний, оскільки ваш переглядач не підтримує інтерфейс об'єктів <code>Promise<code>."; -}</pre> -</div> - -<p>Цей приклад починається натисканням кнопки. Вам потрібен переглядач, що підтримує об'єкти <code>Promise</code>. Натиснувши кнопку кілька разів за короткий відрізок часу, ви навіть побачите, як різні проміси виконуються один після іншого.</p> - -<p>{{EmbedLiveSample("Ускладнений_приклад", "500", "200")}}</p> - -<h2 id="Завантаження_зображення_за_допомогою_XHR">Завантаження зображення за допомогою XHR</h2> - -<p>Інший простий приклад використання об'єктів <code>Promise</code> та <code><a href="/uk/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a></code> - для завантаження зображення - доступний у репозиторії <a href="https://github.com/mdn/js-examples/tree/master/promises-test">promise-test</a> на MDN GitHub. Ви також можете <a href="https://mdn.github.io/js-examples/promises-test/">побачити його в дії</a>. Кожний крок супроводжується коментарями та дозволяє відслідкувати архітектуру Promise та XHR.</p> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise-objects', 'Promise')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this file: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> - -<p>{{Compat("javascript.builtins.Promise")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li><a href="/uk/docs/Web/JavaScript/Guide/Using_promises">Використання промісів</a></li> - <li><a href="http://promisesaplus.com/">Promises/A+ specification</a></li> - <li><a href="https://medium.com/@ramsunvtech/promises-of-promise-part-1-53f769245a53">Venkatraman.R - JS Promise (Part 1, Basics)</a></li> - <li><a href="https://medium.com/@ramsunvtech/js-promise-part-2-q-js-when-js-and-rsvp-js-af596232525c#.dzlqh6ski">Venkatraman.R - JS Promise (Part 2 - Using Q.js, When.js and RSVP.js)</a></li> - <li><a href="https://tech.io/playgrounds/11107/tools-for-promises-unittesting/introduction">Venkatraman.R - Tools for Promises Unit Testing</a></li> - <li><a href="http://www.html5rocks.com/en/tutorials/es6/promises/">Jake Archibald: JavaScript Promises: There and Back Again</a></li> - <li><a href="http://de.slideshare.net/domenicdenicola/callbacks-promises-and-coroutines-oh-my-the-evolution-of-asynchronicity-in-javascript">Domenic Denicola: Callbacks, Promises, and Coroutines – Asynchronous Programming Patterns in JavaScript</a></li> - <li><a href="http://www.mattgreer.org/articles/promises-in-wicked-detail/">Matt Greer: JavaScript Promises ... In Wicked Detail</a></li> - <li><a href="https://www.promisejs.org/">Forbes Lindesay: promisejs.org</a></li> - <li><a href="https://github.com/anonyco/SPromiseMeSpeedJS/blob/master/README.md">Speed-polyfill to polyfill both promise availability and promise performance.</a></li> - <li><a href="https://github.com/jakearchibald/es6-promise/">Promise polyfill</a></li> - <li><a href="https://www.udacity.com/course/javascript-promises--ud898">Udacity: JavaScript Promises</a></li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/promise/index.html b/files/uk/web/javascript/reference/global_objects/promise/promise/index.html deleted file mode 100644 index 574121ebba..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/promise/index.html +++ /dev/null @@ -1,77 +0,0 @@ ---- -title: Конструктор Promise() -slug: Web/JavaScript/Reference/Global_Objects/Promise/Promise -tags: - - JavaScript - - Promise - - Конструктор -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/Promise ---- -<div>{{JSRef}}</div> - -<p>Конструктор <strong><code>Promise</code></strong> використовується переважно для того, щоб загортати функції, які не підтримують проміси початково.</p> - -<div>{{EmbedInteractiveExample("pages/js/promise-constructor.html", "taller")}}</div> - -<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox notranslate">new Promise(<var>executor</var>);</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><code>executor</code></dt> - <dd>Функція, яка передається з аргументами <code>resolve</code> та <code>reject</code>. Функція <code>executor</code> (виконавець) виконується негайно, реалізацією проміса, передаючи функції <code>resolve</code> та <code>reject</code> (виконавець викликається ще до того, як конструктор <code>Promise</code> повертає створений об'єкт). Функції <code>resolve</code> та <code>reject</code>, коли вони викликаються, відповідно, вирішують або відхиляють проміс. Виконавець, зазвичай, ініціює якісь асинхронні дії, і, як тільки вони завершуються, викликає або функцію <code>resolve</code>, щоб вирішити проміс, або відхиляє його в разі виникнення помилки. Якщо функція-виконавець викинула помилку, проміс відхиляється. Повернене значення виконавця ігнорується.</dd> -</dl> - -<h2 id="Приклади">Приклади</h2> - -<p>Об'єкт <code>Promise</code> створюється за допомогою ключового слова <code>new</code> та свого конструктора. Цей конструктор приймає своїм аргументом функцію, що називається "функцією-виконавцем". Ця функція має приймати дві функції в якості параметрів. Перша з цих функцій (<code>resolve</code>) викликається, коли асинхронна задача завершується успішно та повертає результат задачі. Друга (<code>reject</code>) викликається, коли задача завершується неуспішно, та повертає причину невдачі, яка, зазвичай, є об'єктом помилки.</p> - -<pre class="brush: js; notranslate">const myFirstPromise = new Promise((resolve, reject) => { - // зробити щось асинхронне, що зрештою викличе або: - // - // resolve(someValue) // виконаний - // або - // reject("причина невдачі") // відхилений -}); -</pre> - -<p>Щоб надати функцію з функціональністю промісу, просто зробіть, щоб вона повертала проміс:</p> - -<pre class="brush: js; notranslate">function myAsyncFunction(url) { - return new Promise((resolve, reject) => { - const xhr = new XMLHttpRequest() - xhr.open("GET", url) - xhr.onload = () => resolve(xhr.responseText) - xhr.onerror = () => reject(xhr.statusText) - xhr.send() - }); -}</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise-constructor', 'Promise constructor')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> - -<p>{{Compat("javascript.builtins.Promise.Promise")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li><a href="/uk/docs/Web/JavaScript/Guide/Using_promises">Використання промісів</a></li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/race/index.html b/files/uk/web/javascript/reference/global_objects/promise/race/index.html deleted file mode 100644 index c810db2cc0..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/race/index.html +++ /dev/null @@ -1,177 +0,0 @@ ---- -title: Promise.race() -slug: Web/JavaScript/Reference/Global_Objects/Promise/race -tags: - - ECMAScript 2015 - - JavaScript - - Promise - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/race ---- -<div>{{JSRef}}</div> - -<p>Метод <code><strong>Promise.race()</strong></code> повертає проміс, який виконується чи відхиляється, як тільки один з промісів ітерабельного об'єкта буде виконаний чи відхилений, зі значеням або причиною з цього проміса.</p> - -<div>{{EmbedInteractiveExample("pages/js/promise-race.html")}}</div> - -<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"><var>Promise.race(iterable)</var>;</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt>iterable</dt> - <dd>Ітерабельний об'єкт, наприклад, {{jsxref("Array")}}. Дивіться <a href="/uk/docs/Web/JavaScript/Reference/Протоколи_перебору#Протокол_ітерабельного_обєкта">ітерабельний об'єкт</a>.</dd> -</dl> - -<h3 id="Значення_що_повертається">Значення, що повертається</h3> - -<p>Об'єкт {{jsxref("Promise")}} <strong>у стані очікування</strong>, який <strong>асинхронно</strong> видає значення першого проміса з наданого ітерабельного об'єкта, що виконується або відхиляється.</p> - -<h2 id="Опис">Опис</h2> - -<p>Функція <code>race</code> повертає об'єкт <code>Promise</code>, який встановлюється таким самим чином (і отримує таке ж значення), як і перший встановлений проміс ітерабельного об'єкта, переданого як аргумент.</p> - -<p>Якщо передано пустий ітерабельний об'єкт, повернений проміс буде вічно перебувати у стані очікування.</p> - -<p>Якщо ітерабельний об'єкт містить одне або більше значень, що не є промісами, та/або вже встановлений проміс, тоді <code>Promise.race</code> буде вирішено з першим таким значенням, знайденим в ітерабельному об'єкті.</p> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="Асинхронність_Promise.race"><font face="consolas, Liberation Mono, courier, monospace">Асинхронність <code>Promise.race</code></font></h3> - -<p>Цей приклад демострує асинхронність функції <code>Promise.race:</code></p> - -<pre class="brush: js">// ми передаємо в якості аргументу масив вже вирішених промісів, -// щоб запустити Promise.race якомога швидше -var resolvedPromisesArray = [Promise.resolve(33), Promise.resolve(44)]; - -var p = Promise.race(resolvedPromisesArray); -// негайно виводимо значення p -console.log(p); - -// використовуючи setTimeout, ми можемо виконати код, коли стек стане порожнім -setTimeout(function(){ - console.log('тепер стек порожній'); - console.log(p); -}); - -// порядок виведення: -// Promise { <state>: "pending" } -// тепер стек порожній -// Promise { <state>: "fulfilled", <value>: 33 }</pre> - -<p>Пустий ітерабельний об'єкт спричиняє поверення проміса, який вічно знаходитиметься в стані очікування:</p> - -<pre class="brush: js">var foreverPendingPromise = Promise.race([]); -console.log(foreverPendingPromise); -setTimeout(function(){ - console.log('тепер стек порожній'); - console.log(foreverPendingPromise); -}); - -// порядок виведення: -// Promise { <state>: "pending" } -// тепер стек порожній -// Promise { <state>: "pending" } -</pre> - -<p>Якщо ітерабельний об'єкт містить одне або більше значень, що не є промісами, та/або вже встановлені проміси, тоді <code>Promise.race</code> буде вирішено з першим таким значенням, знайденим у масиві:</p> - -<pre class="brush: js">var foreverPendingPromise = Promise.race([]); -var alreadyResolvedProm = Promise.resolve(666); - -var arr = [foreverPendingPromise, alreadyResolvedProm, "не проміс"]; -var arr2 = [foreverPendingPromise, "не проміс", Promise.resolve(666)]; -var p = Promise.race(arr); -var p2 = Promise.race(arr2); - -console.log(p); -console.log(p2); -setTimeout(function(){ - console.log('тепер стек порожній'); - console.log(p); - console.log(p2); -}); - -// порядок виведення: -// Promise { <state>: "pending" } -// Promise { <state>: "pending" } -// тепер стек порожній -// Promise { <state>: "fulfilled", <value>: 666 } -// Promise { <state>: "fulfilled", <value>: "не проміс" } -</pre> - -<h3 id="Використання_Promise.race_–_приклади_з_setTimeout">Використання <code>Promise.race</code> – приклади з <a href="/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout"><code>setTimeout</code></a></h3> - -<pre class="brush: js">var p1 = new Promise(function(resolve, reject) { - setTimeout(() => resolve('один'), 500); -}); -var p2 = new Promise(function(resolve, reject) { - setTimeout(() => resolve('два'), 100); -}); - -Promise.race([p1, p2]) -.then(function(value) { - console.log(value); // "два" - // Обидва вирішуються, але p2 швидший -}); - -var p3 = new Promise(function(resolve, reject) { - setTimeout(() => resolve('три'), 100); -}); -var p4 = new Promise(function(resolve, reject) { - setTimeout(() => reject(new Error('чотири')), 500); -}); - -Promise.race([p3, p4]) -.then(function(value) { - console.log(value); // "три" - // p3 швидший, тому він виконується -}, function(reason) { - // Не викликається -}); - -var p5 = new Promise(function(resolve, reject) { - setTimeout(() => resolve("п'ять"), 500); -}); -var p6 = new Promise(function(resolve, reject) { - setTimeout(() => reject(new Error('шість')), 100); -}); - -Promise.race([p5, p6]) -.then(function(value) { - // Не викликається -}, function(reason) { - console.log(reason); // "шість" - // p6 швидший, тому він відхиляється -});</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise.race', 'Promise.race')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> and send us a pull request.</p> - -<p>{{Compat("javascript.builtins.Promise.race")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li>{{jsxref("Promise")}}</li> - <li>{{jsxref("Promise.all()")}}</li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/reject/index.html b/files/uk/web/javascript/reference/global_objects/promise/reject/index.html deleted file mode 100644 index 11c3630299..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/reject/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: Promise.reject() -slug: Web/JavaScript/Reference/Global_Objects/Promise/reject -tags: - - ECMAScript 2015 - - JavaScript - - Promise - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/reject -original_slug: Web/JavaScript/Reference/Global_Objects/Promise/відхилено ---- -<div>{{JSRef}}</div> - -<p>Метод <code><strong>Promise.reject()</strong></code> повертає об'єкт <code>Promise</code>, відхилений з наданою причиною.</p> - -<p>{{EmbedInteractiveExample("pages/js/promise-reject.html")}}</p> - -<div class="hidden"> -<p>The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> -</div> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox"><var>Promise.reject(reason)</var>;</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt>reason</dt> - <dd>Причина, чому даний проміс був відхилений.</dd> -</dl> - -<h3 id="Значення_яке_повертається">Значення, яке повертається</h3> - -<p>Об'єкт {{jsxref("Promise")}}, відхилений з наданою причиною.</p> - -<h2 id="Опис">Опис</h2> - -<p>Статичний метод <code>Promise.reject</code> повертає відхилений об'єкт <code>Promise</code>. З метою відлагодження, а також вибіркового перехоплення помилок зручно використовувати <code>reason</code> як <code>instanceof</code> {{jsxref("Error")}}.</p> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="Використання_статичного_методу_Promise.reject">Використання статичного методу Promise.reject()</h3> - -<pre class="brush: js">Promise.reject(new Error('fail')).then(function(error) { - // не викликається -}, function(error) { - console.error(error); // стек викликів -});</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise.reject', 'Promise.reject')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this file: <a href="https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json">https://github.com/mdn/browser-compat-data/blob/master/javascript/promise.json</a>.</p> - -<p>{{Compat("javascript.builtins.Promise.reject")}}</p> - -<h2 id="Дивіться_також">Дивіться також</h2> - -<ul> - <li>{{jsxref("Promise")}}</li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/resolve/index.html b/files/uk/web/javascript/reference/global_objects/promise/resolve/index.html deleted file mode 100644 index 88aeba5465..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/resolve/index.html +++ /dev/null @@ -1,137 +0,0 @@ ---- -title: Promise.resolve() -slug: Web/JavaScript/Reference/Global_Objects/Promise/resolve -tags: - - ECMAScript 2015 - - JavaScript - - Method - - Promise - - Проміс - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/resolve ---- -<div>{{JSRef}}</div> - -<p>Метод <code><strong>Promise.resolve()</strong></code> повертає об'єкт {{jsxref("Promise")}}, вирішений з наданим значенням. Якщо значенням є проміс, то цей проміс буде повернено; якщо значенням є промісоподібний об'єкт (thenable) (такий, що має {{jsxref("Promise.then", "метод \"then\"")}}), то повернений проміс буде його "дотримуватись", приймаючи його кінцевий стан; у іншому випадку повернений проміс буде виконаний з наданим значенням. Функція вирівнює вкладені шари промісоподібних об'єктів (наприклад, проміс, що вирішується з промісом, який вирішується з чимось ще) у єдиний шар.</p> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox"><var>Promise.resolve(value)</var>; -</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt>value</dt> - <dd>Аргумент, з яким буде вирішений даний <code>Promise</code>. Також він може бути промісом або промісоподібним об'єктом.</dd> -</dl> - -<h3 id="Значення_яке_повертається">Значення, яке повертається</h3> - -<p>Об'єкт {{jsxref("Promise")}}, вирішений з наданим значенням, або проміс, переданий в якості значення, якщо значення було промісом.</p> - -<h2 id="Опис">Опис</h2> - -<p>Статична функція <code>Promise.resolve</code> повертає вирішений об'єкт <code>Promise</code>.</p> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="Використання_статичного_методу_Promise.resolve">Використання статичного методу <code>Promise.resolve</code></h3> - -<pre class="brush: js">Promise.resolve('Success').then(function(value) { - console.log(value); // "Успіх" -}, function(value) { - // не викликається -}); -</pre> - -<h3 id="Вирішення_проміса_масивом">Вирішення проміса масивом</h3> - -<pre class="brush: js">var p = Promise.resolve([1,2,3]); -p.then(function(v) { - console.log(v[0]); // 1 -}); -</pre> - -<h3 id="Вирішення_проміса_іншим_промісом">Вирішення проміса іншим промісом</h3> - -<pre class="brush: js">var original = Promise.resolve(33); -var cast = Promise.resolve(original); -cast.then(function(value) { - console.log('значення: ' + value); -}); -console.log('original === cast ? ' + (original === cast)); - -// порядок виведення: -// original === cast ? true -// значення: 33</pre> - -<p>Перевернутий порядок логів спричинений тим фактом, що обробники <code>then</code> викликаються асинхронно. Дивіться, як працює <code>then</code> <a href="/uk/docs/Web/JavaScript/Reference/Global_Objects/Promise/then#Значення_що_повертається">тут</a>.</p> - -<h3 id="Вирішення_промісоподібних_обєктів_та_викидання_помилок">Вирішення промісоподібних об'єктів та викидання помилок</h3> - -<pre class="brush: js">// Вирішення промісоподібного об'єкта -var p1 = Promise.resolve({ - then: function(onFulfill, onReject) { onFulfill('виконаний!'); } -}); -console.log(p1 instanceof Promise) // true, об'єкт передано у проміс - -p1.then(function(v) { - console.log(v); // "виконаний!" - }, function(e) { - // не викликається -}); - -// Промісоподібний об'єкт викидає помилку перед зворотнім викликом -// Проміс відхиляється -var thenable = { then: function(resolve) { - throw new TypeError('Помилка'); - resolve('Вирішення'); -}}; - -var p2 = Promise.resolve(thenable); -p2.then(function(v) { - // не викликається -}, function(e) { - console.log(e); // TypeError: Помилка -}); - -// Промісоподібний об'єкт викидає помилку після зворотного виклику -// Проміс вирішується -var thenable = { then: function(resolve) { - resolve('Вирішення'); - throw new TypeError('Помилка'); -}}; - -var p3 = Promise.resolve(thenable); -p3.then(function(v) { - console.log(v); // "Вирішення" -}, function(e) { - // не викликається -}); -</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise.resolve', 'Promise.resolve')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this file: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> - -<p>{{Compat("javascript.builtins.Promise.resolve")}}</p> - -<h2 id="Дивіться_також">Дивіться також</h2> - -<ul> - <li>{{jsxref("Promise")}}</li> -</ul> diff --git a/files/uk/web/javascript/reference/global_objects/promise/then/index.html b/files/uk/web/javascript/reference/global_objects/promise/then/index.html deleted file mode 100644 index 8cbcc884fc..0000000000 --- a/files/uk/web/javascript/reference/global_objects/promise/then/index.html +++ /dev/null @@ -1,297 +0,0 @@ ---- -title: Promise.prototype.then() -slug: Web/JavaScript/Reference/Global_Objects/Promise/then -tags: - - ECMAScript 2015 - - JavaScript - - Promise - - метод -translation_of: Web/JavaScript/Reference/Global_Objects/Promise/then ---- -<div>{{JSRef}}</div> - -<p>Метод <code><strong>then()</strong></code> вертає об'єкт {{jsxref("Promise")}}. Він приймає два аргументи: функції зворотного виклику для випадків успішного та неуспішного проміса.</p> - -<div>{{EmbedInteractiveExample("pages/js/promise-then.html")}}</div> - -<p class="hidden">The source for this interactive demo is stored in a GitHub repository. If you'd like to contribute to the interactive demo project, please clone <a href="https://github.com/mdn/interactive-examples">https://github.com/mdn/interactive-examples</a> and send us a pull request.</p> - -<div class="note"> -<p>Якщо один чи обидва аргументи пропущені, або надані не функції, тоді <code>then</code> не матиме обробників, але не згенерує помилок. Якщо <code>Promise</code>, на якому викликається <code>then</code>, приймає стан (<code>виконання</code> або <code>відхилення</code>), для якого <code>then</code> не має обробника, новий <code>Promise</code> створюється без додаткових обробників, просто приймаючи кінцевий стан оригінального проміса, на якому було викликано <code>then</code>.</p> -</div> - -<h2 id="Синтаксис">Синтаксис</h2> - -<pre class="syntaxbox"><var>p.then(onFulfilled[, onRejected])</var>; - -p.then(value => { - // виконання -}, reason => { - // відхилення -}); -</pre> - -<h3 id="Параметри">Параметри</h3> - -<dl> - <dt><code>onFulfilled</code> {{optional_inline}}</dt> - <dd>{{jsxref("Function","Функція")}}, що викликається, якщо <code>Promise</code> виконано. Ця функція має один аргумент, <code>значення виконання</code>. Якщо це не функція, вона внутрішньо замінюється на функцію "Identity" (вона повертає отриманий аргумент).</dd> - <dt><code>onRejected</code> {{optional_inline}}</dt> - <dd>{{jsxref("Function","Функція")}}, що викликається, якщо <code>Promise</code> відхилено. Ця функція має один аргумент, <code>причина відхилення</code>. Якщо це не функція, вона внутрішньо замінюється на функцію "Thrower" (вона викидає помилку, яку отримала в якості аргумента).</dd> -</dl> - -<h3 id="Значення_що_повертається">Значення, що повертається</h3> - -<p>Як тільки {{jsxref("Promise","проміс")}} був виконаний або відхилений, відповідна функція-обробник (<code style="font-style: normal; font-weight: normal;">onFulfilled</code> або <code style="font-style: normal; font-weight: normal;">onRejected</code>) буде викликана <strong>асинхронно</strong> (запланована у активному циклі потоку). Поведінка функції-обробника відповідає спеціальному набору правил. Якщо функція-обробник:</p> - -<ul> - <li>вертає значення, проміс, повернений <code>then</code>, вирішується з поверненим значенням в якості його значення.</li> - <li>не вертає нічого, проміс, повернений <code>then</code>, вирішується зі значенням <code>undefined</code>.</li> - <li>викидає помилку, проміс, повернений <code>then</code>, відхиляється з викинутою помилкою в якості значення.</li> - <li>вертає вже виконаний проміс, то проміс, повернений <code>then</code>, виконується зі значенням цього проміса в якості свого значення.</li> - <li>вертає вже відхилений проміс, то проміс, повернений <code>then</code>, відхиляється зі значенням цього проміса в якості свого значення.</li> - <li>вертає інший проміс <strong>у стані очікування</strong>, вирішення/відхилення проміса, поверненого <code>then</code>, буде результатом вирішення/відхилення проміса, поверненого обробником. Також, вирішене значення проміса, поверненого <code>then</code>, буде тим самим, що й вирішене значення проміса, поверненого обробником.</li> -</ul> - -<p>Наступний приклад демонструє асинхронність методу <code>then</code>.</p> - -<pre class="brush: js">// при використанні вирішеного проміса блок 'then' буде негайно запущений, -// але його обробники запустяться асинхронно, як демонструє console.log -const resolvedProm = Promise.resolve(33); - -let thenProm = resolvedProm.then(value => { - console.log("Це запускається після завершення головного стеку. Отримане й повернене значення: " + value); - return value; -}); -// негайне логування значення thenProm -console.log(thenProm); - -// використовуючи setTimeout, ми можемо відкласти виконання функції, поки стек не стане порожнім -setTimeout(() => { - console.log(thenProm); -}); - - -// порядок логування: -// Promise {[[PromiseStatus]]: "pending", [[PromiseValue]]: undefined} -// "Це запускається після завершення головного стеку. Отримане й повернене значення: 33" -// Promise {[[PromiseStatus]]: "resolved", [[PromiseValue]]: 33}</pre> - -<h2 id="Опис">Опис</h2> - -<p>Оскільки методи <code>then</code> та {{jsxref("Promise.prototype.catch()")}} вертають проміси, їх <a href="/uk/docs/Web/JavaScript/Guide/Using_promises#Chaining">можна поєднувати в ланцюги</a> — ця операція зветься <em>композицією</em>.</p> - -<h2 id="Приклади">Приклади</h2> - -<h3 id="Використання_метода_then">Використання метода <code>then</code></h3> - -<pre class="brush: js">var p1 = new Promise((resolve, reject) => { - resolve('Успіх!'); - // або - // reject(new Error("Помилка!")); -}); - -p1.then(value => { - console.log(value); // Успіх! -}, reason => { - console.error(reason); // Помилка! -}); -</pre> - -<h3 id="Ланцюгування">Ланцюгування</h3> - -<p>Метод <code>then</code> вертає об'єкт <code>Promise</code>, що дозволяє використовувати ланцюгування.</p> - -<p>Якщо функція, передана у <code>then</code> в якості обробника, вертає об'єкт <code>Promise</code>, аналогічний об'єкт <code>Promise</code> буде переданий у наступний <code>then</code> ланцюга методів. Наведений нижче фрагмент імітує асинхронний код функцією <code>setTimeout</code>. </p> - -<pre class="brush: js">Promise.resolve('ква') - // 1. Отримати "ква", приєднати "драт" та вирішити це для наступного then - .then(function(string) { - return new Promise(function(resolve, reject) { - setTimeout(function() { - string += 'драт'; - resolve(string); - }, 1); - }); - }) - // 2. отримати "квадрат", призначити функцію зворотного виклику для обробки цього рядка - // та вивести його на консоль, але не раніше повернення необробленого рядка - // string у наступний then - .then(function(string) { - setTimeout(function() { - string += 'ура'; - console.log(string); - }, 1) - return string; - }) - // 3. вивести допоміжні повідомлення щодо того, як виконується код в цьому розділі, - // раніше, ніж рядок string буде оброблений імітованим асинхронним кодом у - // попередньому блоці then. - .then(function(string) { - console.log("Останній Then: йой... ми не створили та не повернули екземпляр проміса " + - "у попередньому then, тому послідовність може бути трохи " + - "несподіваною"); - - // Зауважте, що `string` не матиме частини 'ура' в цій точці. Це тому, - // що ми імітували його асинхронне виконання за допомогою функції setTimeout - console.log(string); - }); - -// порядок виведення: -// Останній Then: йой... ми не створили та не повернули екземпляр проміса у попередньому then, тому послідовність може бути трохи несподіваною -// квадрат -// квадратура</pre> - -<p>Коли значення просто повертається з обробника <code>then</code>, він поверне <code>Promise.resolve(<значення, повернене обробником, що викликався>)</code>.</p> - -<pre class="brush: js">var p2 = new Promise(function(resolve, reject) { - resolve(1); -}); - -p2.then(function(value) { - console.log(value); // 1 - return value + 1; -}).then(function(value) { - console.log(value + ' - Синхронне значення працює'); -}); - -p2.then(function(value) { - console.log(value); // 1 -}); -</pre> - -<p>Виклик <code>then</code> поверне відхилений проміс, якщо функція викидає помилку або повертає відхилений проміс.</p> - -<pre class="brush: js">Promise.resolve() - .then(() => { - // Змушує .then() повернути відхилений проміс - throw new Error('О, ні!'); - }) - .then(() => { - console.log('Не викликається.'); - }, error => { - console.error('Викликано функцію onRejected: ' + error.message); - });</pre> - -<p>У всіх інших випадках повертається вирішений об'єкт Promise. У наступному прикладі перший <code>then()</code> поверне значення <code>42</code>, загорнуте у вирішений проміс, незважаючи на те, що попередній проміс ланцюжка був відхилений.</p> - -<pre class="brush: js">Promise.reject() - .then(() => 99, () => 42) // onRejected вертає 42, обгорнуте у вирішений Promise - .then(solution => console.log('Вирішений зі значенням ' + solution)); // Вирішений зі значенням 42</pre> - -<p>На практиці часто бажано перехоплювати відхилені проміси, як продемонстровано нижче, а не використовувати синтаксис <code>then</code> для двох випадків.</p> - -<pre class="brush: js">Promise.resolve() - .then(() => { - // Змушує .then() повернути відхилений проміс - throw new Error('О, ні!'); - }) - .catch(error => { - console.error('Викликано функцію onRejected: ' + error.message); - }) - .then(() => { - console.log("Мене завжди викликають, навіть якщо проміс попереднього then відхилено"); - });</pre> - -<p>Ви також можете використати ланцюгування, щоб реалізувати функцію з API на промісах, на основі іншої такої функції.</p> - -<pre class="brush: js">function fetch_current_data() { - // API <a href="/uk/docs/Web/API/GlobalFetch/fetch">fetch</a>() вертає проміс. Ця функція - // створює схожий API, крім того, що над значенням - // виконанного проміса цієї функції виконується - // більше дій. - return fetch('current-data.json').then(response => { - if (response.headers.get('content-type') != 'application/json') { - throw new TypeError(); - } - var j = response.json(); - // можливо, зробити щось із j - return j; // значення виконання, що надається користувачу - // fetch_current_data().then() - }); -} -</pre> - -<p>Якщо <code>onFulfilled</code> вертає проміс, повернене значення <code>then</code> буде вирішене чи відхилене промісом.</p> - -<pre class="brush: js">function resolveLater(resolve, reject) { - setTimeout(function() { - resolve(10); - }, 1000); -} -function rejectLater(resolve, reject) { - setTimeout(function() { - reject(new Error('Помилка')); - }, 1000); -} - -var p1 = Promise.resolve('ква'); -var p2 = p1.then(function() { - // Повернути тут проміс, який буде вирішений зі значенням 10 через 1 секунду - return new Promise(resolveLater); -}); -p2.then(function(v) { - console.log('вирішений', v); // "вирішений", 10 -}, function(e) { - // не викликається - console.error('відхилений', e); -}); - -var p3 = p1.then(function() { - // Повернути тут проміс, що відхилятиметься з помилкою 'Помилка' через 1 секунду - return new Promise(rejectLater); -}); -p3.then(function(v) { - // не викликається - console.log('вирішений', v); -}, function(e) { - console.error('відхилений', e); // "відхилений", 'Помилка' -}); -</pre> - -<h3 id="Поліфіл_у_стилі_window.setImmediate_на_основі_промісів">Поліфіл у стилі <a href="/uk/docs/Web/API/Window/setImmediate" title="Цей метод використовується для розбиття довгих у виконанні операцій та запуску функції зворотного виклику негайно після того, як переглядач завершив інші операції, такі, як події та оновлення відображення">window.setImmediate</a> на основі промісів</h3> - -<p>Використання методу {{jsxref("Function.prototype.bind()")}} <code>Reflect.apply</code> ({{jsxref("Reflect.apply()")}}) для створення функції (що не скасовується) у стилі setImmediate.</p> - -<pre class="brush: js">const nextTick = (() => { - const noop = () => {}; // буквально - const nextTickPromise = () => Promise.resolve().then(noop); - - const rfab = Reflect.apply.bind; // (thisArg, fn, thisArg, [...args]) - const nextTick = (fn, ...args) => ( - fn !== undefined - ? Promise.resolve(args).then(rfab(null, fn, null)) - : nextTickPromise(), - undefined - ); - nextTick.ntp = nextTickPromise; - - return nextTick; -})(); -</pre> - -<h2 id="Специфікації">Специфікації</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Специфікація</th> - </tr> - <tr> - <td>{{SpecName('ESDraft', '#sec-promise.prototype.then', 'Promise.prototype.then')}}</td> - </tr> - </tbody> -</table> - -<h2 id="Сумісність_з_веб-переглядачами">Сумісність з веб-переглядачами</h2> - -<p class="hidden">To contribute to this compatibility data, please write a pull request against this repository: <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</p> - -<p>{{Compat("javascript.builtins.Promise.then")}}</p> - -<h2 id="Див._також">Див. також</h2> - -<ul> - <li>{{jsxref("Promise")}}</li> - <li>{{jsxref("Promise.prototype.catch()")}}</li> -</ul> |