TL;DR
To handle errors in asynchronous operations, you can use try...catch blocks with async/await syntax or .catch() method with Promises. For example, with async/await, you can wrap your code in a try...catch block to catch any errors:
async function fetchData() {
try {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
console.log(data);
} catch (error) {
console.error('Error fetching data:', error);
}
}
With Promises, you can use the .catch() method:
fetch('https://api.example.com/data')
.then((response) => response.json())
.then((data) => console.log(data))
.catch((error) => console.error('Error fetching data:', error));
Using try...catch with async/await
Basic usage
When using async/await, you can handle errors by wrapping your asynchronous code in a try...catch block. This allows you to catch any errors that occur during the execution of the await statement.
async function fetchData() {
try {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
console.log(data);
} catch (error) {
console.error('Error fetching data:', error);
}
}
Nested asynchronous operations
If you have multiple asynchronous operations, you can nest try...catch blocks to handle errors at different levels.
async function fetchData() {
try {
const response = await fetch('https://api.example.com/data');
const data = await response.json();
console.log(data);
} catch (error) {
console.error('Error fetching data:', error);
}
}
async function processData() {
try {
await fetchData();
} catch (error) {
console.error('Error processing data:', error);
}
}
Using .catch() with Promises
Basic usage
When working with Promises, you can handle errors using the .catch() method. This method is called if the Promise is rejected.
fetch('https://api.example.com/data')
.then((response) => response.json())
.then((data) => console.log(data))
.catch((error) => console.error('Error fetching data:', error));
Chaining multiple Promises
If you have multiple Promises chained together, you can use a single .catch() at the end to handle any errors that occur in any of the Promises.
fetch('https://api.example.com/data')
.then((response) => response.json())
.then((data) => {
return processData(data);
})
.then((result) => {
console.log(result);
})
.catch((error) => console.error('Error in the chain:', error));
Further reading