Що таке ланцюжок промісів у JavaScript
Що таке ланцюжки промісів?
Ланцюжки промісів — це механізм, де кожен .then() повертає новий проміс, що дозволяє вам створювати ланцюг асинхронних операцій.
В основному, це означає, що результат одного .then() передається наступному .then(), поки не буде досягнуто фінальний результат.
Приклад
javascript
fetch("/user.json")
.then(response => response.json()) // проміс #1
.then(user => fetch(`/users/${user.id}`)) // проміс #2
.then(response => response.json()) // проміс #3
.then(userData => console.log(userData)) // проміс #4
.catch(error => console.error(error)); // обробка помилокТут кожен
.then()повертає новий проміс, а наступний.then()чекає на його завершення — це називається ланцюгом промісів.
Важливо пам'ятати
- Кожен
.then()завжди повертає проміс, навіть якщо повернення не вказано явно. - Якщо ви повертаєте значення (не проміс) всередині
.then(), воно автоматично буде обгорнуте в проміс. - Якщо всередині
.then()виникає виключення — воно буде передане найближчому.catch().
Неправильний приклад (без ланцюгів)
javascript
fetch("/user.json").then(response => {
response.json().then(user => {
fetch(`/users/${user.id}`).then(response => {
response.json().then(userData => {
console.log(userData);
});
});
});
});Таке "вкладене" використання промісів називається "пекло колбеків" і ускладнює читання та обслуговування коду.
Те ж саме з ланцюгами
javascript
fetch("/user.json")
.then(res => res.json())
.then(user => fetch(`/users/${user.id}`))
.then(res => res.json())
.then(data => console.log(data))
.catch(err => console.error(err));Висновок
- Ланцюги промісів — це важлива концепція для роботи з асинхронним кодом.
- Використовуйте
.then()правильно: повертайте проміси, щоб створювати ланцюги. - Це дозволяє писати чистий, лінійний і зручний код, без вкладень і плутанини.
Факт:
async/await — це синтаксичний цукор над Promise chaining.
Коротка відповідь
Для співбесідиPremium
Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.