async await tutorial code example
Example 1: async await
const data = async () => {
const got = await fetch('https://jsonplaceholder.typicode.com/todos/1');
console.log(await got.json())
}
data();
Example 2: js async await
/* Notes:
1. written like synchronous code
2. compatible with try/catch blocks
3. avoids chaining .then statements
4. async functions always return a promise
5. function pauses on each await expression
6. A non promise value is converted to
Promise.resolve(value) and then resolved
*/
// Syntax
// Function Declaration
async function myFunction(){
await ... // some code goes here
}
// Arrow Declaration
const myFunction2 = async () => {
await ... // some code goes here
}
// OBJECT METHODS
const obj = {
async getName() {
return fetch('https://www.example.com');
}
}
// IN A CLASS
class Obj {
// getters and setter CANNOT be async
async getResource {
return fetch('https://www.example.com');
}
}
Example 3: async await
async function f() {
try {
let response = await fetch('/no-user-here');
let user = await response.json();
} catch(err) {
// catches errors both in fetch and response.json
alert(err);
}
}
f();
Example 4: async await
async function showAvatar() {
// read
await setTimeout(resolve, 3000);
// read next 3s
}
showAvatar();
Example 5: async and await
function delayResult() {
return new Promise(resolve => {
setTimeout(() => {
resolve(‘Done’);
}, 5000)
})
}
async function getResult() {
let result = await delayResult();
return result;
}
getResult();
Example 6: async await js
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);
});