const data = async () => {
const got = await fetch('https://jsonplaceholder.typicode.com/todos/1');
console.log(await got.json())
}
data();// example using promise
const user = () => {
fetch("https://randomuser.me/api/?results=1")
.then((data) => {
console.log(data); // here you recive data
}).catch((err)=>{
console.log(err); // here error
});
}
// example using async/await
const user = async () => {
// you must have use async keyword before use await
const data = await fetch("https://randomuser.me/api/?results=1");
console.log(data); // if error occured it will be null or empty
}
const yourAsyncFunction = async () => {
// do something asynchronously and return a promise
return result;
}
anArray.forEach(async item => {
// do something asynchronously for each item in 'anArray'
// one could also use .map here to return an array of promises to use with 'Promise.all()'
});
server.getPeople().then(async people => {
people.forEach(person => {
// do something asynchronously for each person
});
});const foo = async () => {
await// do something
}
// OR
async function foo() {
await// do something
}// ASYNC will always returns promises
// NOTE : AWAIT should be kept only inside ASYNC function
// AWAIT can't be used in regular function
/* TIPS : Js is single threaded & synchronous in nature BUT, we can
make it as asyncronous by using (ASYNC/AWAIT)*/
//(Example 1 : fetching Random Image)
async function RandomImage(){ //remember async and await is powerful for async operations, always await should be inside of async only.
try {
const raw_response = await fetch("https://www.themealdb.com/api/json/v1/1/random.php");
if (!raw_response.ok) { // check for the 404 errors
throw new Error(raw_response.status);
}
const json_data = await raw_response.json(); //AWAIT
let data = json_data.meals[0];
console.log(data);
}
catch (error) { // catch block for network errors
console.log(error);
}
}
RandomImage();
//(Example 2 : returning another promise)
console.log("1 is working");
console.log("2 is working");
var AsyncFunction = async() => {
var x = new Promise((resolve,reject) => {
setTimeout(() => resolve("3 is working"), 3000);
});
var result = await x;
return result;
}
AsyncFunction().then(resolved => console.log(resolved));
console.log("3 is working");fetch('coffee.jpg')
.then(response => {
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
} else {
return response.blob();
}
})
.then(myBlob => {
let objectURL = URL.createObjectURL(myBlob);
let image = document.createElement('img');
image.src = objectURL;
document.body.appendChild(image);
})
.catch(e => {
console.log('There has been a problem with your fetch operation: ' + e.message);
});