async function
Estimated reading time: 3 minutesasync
is short form of asynchronous. async behavior is opposite of sync. Promise
more comfort with async
.
synchronous vs asynchronous
synchronous
- execute step by step in sequence.
- each statement wait for previous statement executing.
console.log('one para');
console.log('two para');
console.log('three para');
// output:
// one para
// two para
// three para
asynchronous
- don’t excute in sequence.
- don’t wait for excute
setTimeout(() => {
console.log('one');
},3000)
console.log('two');
console.log('three');
// if gradually , output : one, two, three
// but asynchronous output : two,three ,one
// don't wait for one excute
async function
let users = async () => {
return 1;
}
users().then(t => console.log(t));
await
- await wait until promise settle.
- await use only inside async function;
let users = async()=> {
let promise = new Promise((resolve,reject)=> {
let name = 'kamal';
setTimeout(()=> {
resolve(name);
},5000);
});
let userName = await promise;
console.log(userName);
}
users();
users = async() => {
let git = await fetch('https://api.github.com/users/mostafa6765');
let gitUser = await git.json();
return gitUser;
}
users().then(t => console.log(t));
error
- try…catch
- then…catch (promise)
try -> catch
users = async() => {
try{
let git = await fetch('https://no-url');
let gitUser = await git.json();
return gitUser;
}catch(e){
alert(e)
}
}
users().then(t => console.log(t));
then -> catch
users = async() => {
let git = await fetch('https://no-url');
let gitUser = await git.json();
return gitUser;
}
users().then(t => console.log(t)).catch(t=> console.log(t));
resource
- https://javascript.info/async-await
- https://rowanmanning.com/posts/javascript-for-beginners-async/
- https://www.pluralsight.com/guides/introduction-to-asynchronous-javascript