What is Async and Await?
What is async and await?
Handling asynchronous actions in JavaScript was originally done using callback functions. But the ES6 version of JavaScript introduced Promises and the .then()
and .catch()
syntax.
After ES6, the JavaScript language has continued to evolve and provide even more ways of handling asynchronous actions, like async
and await
. This new syntax allows developers to treat asynchronous code as if it were synchronous and write cleaner code without getting caught up in chaining .then()
s and .catch()
s. Take a look below, the first example is using the .then()
method:
myPromise().then((resolvedValue) => {console.log(resolvedValue);});
Now compare it with using async
and await
:
const myAsyncFunc = async () => {let resolvedValue = await myPromise();console.log(resolvedValue);};
Both code snippets do the same thing! The async
keyword makes the function capable of handling asynchronous code, that has the await
keyword. Both keywords are syntactic sugar — it doesn’t introduce new functionality into the language, it makes it slightly easier to write and read. In this course, Build a Professional Website with Wix, we’ll be using the .then()
and .catch()
syntax to teach asynchronicity but we still wanted to introduce async
and await
for your web development progress.
So the choice is yours. If you want to learn more about this cool ES6 feature and get into the pros and cons continue on to the lesson and quiz. Otherwise, you can go straight to learning about the backend!
'The Codecademy Team, composed of experienced educators and tech experts, is dedicated to making tech skills accessible to all. We empower learners worldwide with expert-reviewed content that develops and enhances the technical skills needed to advance and succeed in their careers.'
Meet the full teamRelated articles
- Article
JavaScript Versions: ES6 and Before
Ever heard of the term "ES6" and wondered what it's about? Read this article to read and find out! - Article
Why Learn Asynchronous JavaScript?
Let's explore how asynchronous JavaScript helps us create more efficient apps. - Article
JavaScript Glossary
Programming reference for JavaScript.
Learn more on Codecademy
- Free course
Velo by Wix: Using Async Actions for the Backend
Integrate JavaScript asynchronous actions with Velo to create a backend.Beginner Friendly4 hours - Free course
Learn JavaScript: Asynchronous Programming
Create efficient asynchronous programs using Promises and the async/await syntax.Beginner Friendly3 hours - Free course
Learn Intermediate JavaScript
Take your JavaScript knowledge to the next level by learning how to use advanced functions to create more efficient programs.Intermediate11 hours