asyncDemo.js
function fetchDataCallback(callback) {
setTimeout(() => {
callback("Data fetched using callback");
}, 2000);
}
function displayDataCallback() {
fetchDataCallback((data) => {
console.log(data);
});
}
function fetchDataPromise() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("Data fetched using promise");
}, 2000);
});
}
function displayDataPromise() {
fetchDataPromise()
.then((data) => console.log(data))
.catch((error) => console.error("Error:", error));
}
async function fetchDataAsync() {
return new Promise((resolve) => {
setTimeout(() => {
resolve("Data fetched using async/await");
}, 2000);
});
}
async function displayDataAsync() {
try {
const data = await fetchDataAsync();
console.log(data);
} catch (error) {
console.error("Error:", error);
}
}
console.log("Starting Callback example...");
displayDataCallback();
setTimeout(() => {
console.log("\nStarting Promise example...");
displayDataPromise();
}, 3000);
setTimeout(() => {
console.log("\nStarting Async/Await example...");
displayDataAsync();
}, 6000);
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter