Здравствуйте! В этом уроке рассмотрим обработку ошибок в промисах. Дело в том, что цепочки промисов отлично подходят для перехвата ошибок. Если промис завершается с ошибкой, то управление переходит как раз в ближайший обработчик ошибок. На практике это бывает очень удобно.
Например, в представленном ниже примере для fetch указана неправильная ссылка (сайт не существует), и .catch естественно перехватывает ошибку:
fetch('https://no-such-server.blabla')
// ошибка .then(response => response.json())
.catch(err => alert(err))
// TypeError:
failed to fetch (текст может отличаться)
Как видно, .catch не обязательно должен быть сразу после ошибки, он может быть далее, после одного или даже нескольких вызовов .then
Или, может быть, с сервером всё в порядке, но в ответе мы получим некорректный JSON. Самый лёгкий путь перехватить все ошибки – это добавить .catch в самый конец цепочки:
fetch('/article/promise-chaining/user.json')
.then(response => response.json())
.then(user => fetch(`https://api.github.com/users/${user.name}`))
.then(response => response.json())
.then(githubUser => new Promise((resolve, reject) => {
let img = document.createElement('img');
img.src = githubUser.avatar_url;
img.className = "promise-avatar-example";
document.body.append(img);
setTimeout(() => {
img.remove();
resolve(githubUser); }, 3000); }))
.catch(error => alert(error.message));
Если все в порядке, то такой .catch вообще не выполнится. Но если любой из промисов будет отклонён (проблемы с сетью или некорректная json-строка, или что угодно другое), то ошибка будет перехвачена. Читать далее