Skip to content

Commit

Permalink
update(JS): web/javascript/reference/global_objects/promise (#593)
Browse files Browse the repository at this point in the history
* update(JS): web/javascript/reference/global_objects/promise

* update(JS): web/javascript/reference/global_objects/promise
  • Loading branch information
undead404 authored Sep 7, 2022
1 parent 4984500 commit 7739f50
Show file tree
Hide file tree
Showing 2 changed files with 33 additions and 32 deletions.
54 changes: 27 additions & 27 deletions files/uk/web/javascript/reference/global_objects/promise/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ _Кінцевий стан_ промісу, який знаходиться в

Про проміс кажуть, що він _залагоджений_, якщо він або сповнився, або відхилився, але не перебуває в стані очікування.

![](promises.png)
![Діаграма, що показує, як стан промісу змінюється між очікуванням, сповненістю та відхиленістю за допомогою обробників then/catch. Проміс в стані очікування може стати або сповненим, або відхиленим. Якщо він був сповнений, то виконується обробник "при сповненні", або ж перший параметр метода then(), і продовжуються подальші асинхронні дії. Якщо проміс був відхилений, то виконується обробник помилки, або переданий як другий параметр метода then(), або як єдиний параметр метода catch().](promises.png)

Також можна зустріти використання з промісами терміну _вирішений_, – це означає, що проміс залагоджений або "замкнений" на відповідність кінцевому стану іншого проміса, і подальше його вирішення чи відхилення буде безрезультатним. Документ [Стани та долі (англ.)](https://github.com/domenic/promises-unwrapping/blob/master/docs/states-and-fates.md) з оригінальної пропозиції промісів містить більше деталей щодо термінології промісів. У розмовній мові "вирішені" проміси нерідко еквівалентні до "сповнених", але, як це показано в "Станах та долях", вирішені проміси також можуть очікувати чи бути відхиленими. Наприклад:

Expand All @@ -53,7 +53,7 @@ new Promise((resolveOuter) => {
### Ланцюжки промісів

Методи `{{jsxref("Promise.prototype.then()")}}`, `{{jsxref("Promise.prototype.catch()")}}` і `{{jsxref("Promise.prototype.finally()")}}` використовуються, щоб приєднати якусь наступну дію до промісу, який залагоджується. Оскільки методи `{{JSxRef("Promise.then", "Promise.prototype.then()")}}` та `{{JSxRef("Promise.catch", "Promise.prototype.catch()")}}` повертають проміси, їх виклики можна об'єднати в ланцюжок.
Методи `{{jsxref("Promise.prototype.then()")}}`, `{{jsxref("Promise.prototype.catch()")}}` і `{{jsxref("Promise.prototype.finally()")}}` використовуються, щоб приєднати якусь наступну дію до промісу, який залагоджується. Оскільки методи `{{JSxRef("Promise/then", "Promise.prototype.then()")}}` та `{{JSxRef("Promise/catch", "Promise.prototype.catch()")}}` повертають проміси, їх виклики можна об'єднати в ланцюжок.

Метод `.then()` приймає до двох аргументів; перший — це функція зворотного виклику для сповнення промісу, а другий — відповідно, функція для його відхилення. Кожний `.then()` повертає новостворений об'єкт промісу, який далі може (необов'язково) використовуватися для нарощування ланцюжка викликів, як от:

Expand Down Expand Up @@ -184,7 +184,7 @@ Promise.resolve(aThenable); // Проміс сповнюється значен
const bound = frames[0].postMessage.bind(frames[0], 'some data', '*');
// bound містить вбудовану функцію, тобто тут немає
// користувацького коду на стеку, тож яку область ми використаємо?
window.setTimeout(bound);
setTimeout(bound);
// це все ж працює, оскільки ми використовуємо наймолодшу
// область (поточну) на стеку
</script>
Expand Down Expand Up @@ -299,7 +299,7 @@ Promise.resolve(aThenable); // Проміс сповнюється значен
const myFirstPromise = new Promise((resolve, reject) => {
// Викликаємо resolve(...), коли те, що ми робимо асинхронно, завершилося успіхом, і reject(...), якщо операція була невдалою.
// В цьому прикладі використаємо setTimeout(...) для симуляції асинхронного коду.
// На практиці тут буде щось схоже на XHR чи HTML5 API.
// На практиці тут буде щось схоже на XHR чи API HTML.
setTimeout(() => {
resolve('Успіх!'); // Ура! Все пройшло добре!
}, 250);
Expand All @@ -308,7 +308,7 @@ const myFirstPromise = new Promise((resolve, reject) => {
myFirstPromise.then((successMessage) => {
// successMessage — це будь-яке значення, яке ми передаємо в функцію resolve(...) вище.
// Воно не зобов'язане бути рядком, проте якщо це просто повідомлення про успіх — воно, ймовірно, буде рядком.
console.log('Ура! ' + successMessage);
console.log(`Ура! ${successMessage}`);
});
```

Expand All @@ -318,7 +318,7 @@ myFirstPromise.then((successMessage) => {

Функція `tetheredGetNumber()` в прикладі зображає генератор промісу, який викличе `reject()` або під час влаштування асинхронного виклику, або всередині функції зворотного виклику, або ж і там, і там. Функція `promiseGetWord()` ілюструє, як функція API може створювати та повертати проміс автономно.

Зауважте, що функція `troubleWithGetNumber()` завершується `throw()`. Це вимушений крок, оскільки послідовність промісів у ES6 проходить через всі `.then()`, навіть після помилки. І без цього "throw()" помилка буде здаватися "виправленою". Це зайвий клопіт, і через це зазвичай опускають `rejectionFunc` у всій послідовності промісів `.then()` і просто залишають єдину `rejectionFunc` всередині кінцевого `catch()`. Альтернативно можна викинути особливе значення (в цьому випадку "-999", проте більш правильно мати власний тип об'єкта Error).
Зауважте, що функція `troubleWithGetNumber()` завершується `throw`. Це вимушений крок, оскільки послідовність промісів у ES6 проходить через всі `.then()`, навіть після помилки. І без цього `throw` помилка буде здаватися "виправленою". Це зайвий клопіт, і через це зазвичай опускають `rejectionFunc` у всій послідовності промісів `.then()` і просто залишають єдину `rejectionFunc` всередині кінцевого `catch()`.

Цей код може запускатися в середовищі NodeJS. Він буде більш зрозумілим, якщо переглянути помилки, які виникнуть у процесі виконання. Щоб збільшити кількість помилок, змініть значення `threshold`.

Expand All @@ -330,32 +330,31 @@ function tetheredGetNumber(resolve, reject) {
setTimeout(() => {
const randomInt = Date.now();
const value = randomInt % 10;
if (value >= THRESHOLD_A) {
reject(`Завелике значення: ${value}`);
} else {
if (value < THRESHOLD_A) {
resolve(value);
} else {
reject(`Завелике значення: ${value}`);
}
}, 500);
}
function determineParity(value) {
const isOdd = value % 2 === 1;
const parityInfo = { value, isOdd };
return parityInfo;
return { value, isOdd };
}

function troubleWithGetNumber(reason) {
console.error(`Проблема з отриманням числа: ${reason}`);
throw -999; // необхідно викинути щось для збереження інформації про помилку далі в послідовності
const err = new Error('Проблема з отриманням числа', { cause: reason });
console.error(err);
throw err;
}

function promiseGetWord(parityInfo) {
return new Promise((resolve, reject) => {
const { value } = parityInfo;
const threshold_B = THRESHOLD_A - 1;
if (value >= threshold_B) {
const { value, isOdd } = parityInfo;
if (value >= THRESHOLD_A - 1) {
reject(`Все ж завелике значення: ${value}`);
} else {
parityInfo.wordEvenOdd = parityInfo.isOdd ? 'odd' : 'even';
parityInfo.wordEvenOdd = isOdd ? 'odd' : 'even';
resolve(parityInfo);
}
});
Expand All @@ -365,11 +364,11 @@ new Promise(tetheredGetNumber)
.then(determineParity, troubleWithGetNumber)
.then(promiseGetWord)
.then((info) => {
console.log('Отримали: ', info.theNumber, ' , ', info.wordEvenOdd);
console.log(`Отримано: ${info.value}, ${info.wordEvenOdd}`);
return info;
})
.catch((reason) => {
if (reason === -999) {
if (reason.cause) {
console.error('Маємо помилку, оброблену раніше');
} else {
console.error(`Проблема з promiseGetWord(): ${reason}`);
Expand Down Expand Up @@ -403,18 +402,19 @@ function testPromise() {
const thisPromiseCount = ++promiseCount;
const log = document.getElementById('log');
// початок
log.insertAdjacentHTML('beforeend', thisPromiseCount + ') Started<br>');
// Створюємо новий проміс: ми зобов'язуємося надати числовий лічильник цього промісу, що починається з 1 (після очікування протягом 3 секунд)
log.insertAdjacentHTML('beforeend', `${thisPromiseCount}) Почалося<br>`);
// Створюємо новий проміс: ми зобов'язуємося надати числовий лічильник цього промісу,
// що починається з 1 (після очікування протягом 3 секунд)
const p1 = new Promise((resolve, reject) => {
// Функція, яка працює над виконанням промісу,
// викликається з можливістю або виконати, або відхилити проміс
// Функція, яка працює над виконанням промісу, викликається з можливістю
// або вирішити, або відхилити проміс
log.insertAdjacentHTML(
'beforeend',
thisPromiseCount + ') Конструктор промісу<br>',
`${thisPromiseCount}) Конструктор промісу<br>`,
);
// Це лише приклад того, як може виникнути асинхронність
setTimeout(() => {
// Сповнюємо проміс!
// Сповнюємо проміс
resolve(thisPromiseCount);
}, Math.random() * 2000 + 1000);
});
Expand All @@ -423,15 +423,15 @@ function testPromise() {
// а за допомогою виклику catch() — що робити, якщо проміс відхилено
p1.then((val) => {
// Виводимо значення, яким сповнився проміс
log.insertAdjacentHTML('beforeend', val + ') Проміс сповнено<br>');
log.insertAdjacentHTML('beforeend', `${val}) Проміс сповнено<br>`);
}).catch((reason) => {
// Виводимо причину відхилення промісу
console.log(`Тут оброблено відхилений проміс (${reason}).`);
});
// кінець
log.insertAdjacentHTML(
'beforeend',
thisPromiseCount + ') Проміс створено<br>',
`${thisPromiseCount}) Проміс виконано<br>`,
);
}

Expand Down
11 changes: 6 additions & 5 deletions uk_spelling_additions.txt
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
вебтехнологій
викази
вимкненості
відхиленістю
властивості-значення
властивості-функції
геттер
Expand Down Expand Up @@ -60,14 +61,14 @@
непромісні
непромісом
нерядкове
нерядкові
нерядкових
нерядкові
несемантичних
несимвольні
несимвольними
нетеговані
несимвольні
нетегованим
нетегованих
нетеговані
нетекстових
неюнікодними
обгортку-предка
Expand All @@ -77,8 +78,8 @@
парсингу
перелічуваність
перелічуваністю
підваріантів
підваріанти
підваріантів
підзначення
підзображення
підкласових
Expand Down Expand Up @@ -135,4 +136,4 @@ JSON-серіалізовним
Mozilla-специфічне
Promise'и
then-спроможним
Unix-подібних
Unix-подібних

0 comments on commit 7739f50

Please sign in to comment.