Skip to content

Commit 47367af

Browse files
authored
Merge pull request mbeaudru#26 from Shridhad/master
Add details about async-await
2 parents 0b81f9d + 9490527 commit 47367af

File tree

1 file changed

+44
-0
lines changed

1 file changed

+44
-0
lines changed

readme.md

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -84,6 +84,10 @@ When you struggle to understand a notion, I suggest you look for answers on the
8484
+ [Class](#class)
8585
- [Samples](#samples)
8686
- [External resources](#external-resources-5)
87+
+ [Async Await](#async-await)
88+
- [Sample code](#sample-code-6)
89+
- [Explanation](#explanation-4)
90+
- [External resources](#external-resources-7)
8791
* [Glossary](#glossary)
8892
+ [Scope](#-scope)
8993
+ [Variable mutation](#-variable-mutation)
@@ -1182,6 +1186,46 @@ For classes understanding:
11821186
- [ES6 Features - Classes](http://es6-features.org/#ClassDefinition)
11831187
- [JavaScript Classes - MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes)
11841188

1189+
### Async Await
1190+
1191+
In addition to [Promises](#promises), there is a new syntax you might encounter to handle asynchronous code named *async / await*.
1192+
1193+
The purpose of async/await functions is to simplify the behavior of using promises synchronously and to perform some behavior on a group of Promises. Just as Promises are similar to structured callbacks, async/await is similar to combining generators and promises. ([Ref: MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function))
1194+
1195+
> **Note :** You must understand what are promises and how they work before trying to understand async / await since they rely on it.
1196+
1197+
> **Note 2:** [*await* must be used in an *async* function](https://hackernoon.com/6-reasons-why-javascripts-async-await-blows-promises-away-tutorial-c7ec10518dd9#f3f0), which means that you can't use await in the top level of our code since that is not inside an async function.
1198+
1199+
#### Explanation with sample code
1200+
1201+
*Async / Await* is built on promises but they allow a more imperative style of code.
1202+
1203+
An `await` expression causes `async` function to pause the execution, wait for promise to resolve, and then resume the execution once the value is resolved. Any `async` function returns the `Promise`, and will be resolved to returned value.
1204+
1205+
```js
1206+
async function getGithubUser(handle) { // async keyword allows usage of await in the function and means function returns a promise
1207+
try { // this is how errors are handled with async / await
1208+
const url = `https://api.github.com/users/${handle}`;
1209+
const response = await fetch(url); // "synchronously" waiting fetch promise to resolve before going to next line
1210+
return response.json();
1211+
} catch (err) {
1212+
alert(err);
1213+
}
1214+
}
1215+
1216+
getGithubUser('mbeaudru').then(user => console.log(user)); // logging user response - cannot use await syntax since this code isn't in async function
1217+
```
1218+
1219+
#### External resources
1220+
1221+
- [Async/Await - JavaScript.Info](https://javascript.info/async-await)
1222+
- [ES7 Async/Await](http://rossboucher.com/await/#/)
1223+
- [6 Reasons Why JavaScript’s Async/Await Blows Promises Away](https://hackernoon.com/6-reasons-why-javascripts-async-await-blows-promises-away-tutorial-c7ec10518dd9)
1224+
- [JavaScript awaits](https://dev.to/kayis/javascript-awaits)
1225+
- [Using Async Await in Express with Node 8](https://medium.com/@Abazhenov/using-async-await-in-express-with-node-8-b8af872c0016)
1226+
- [Async Function](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/async_function)
1227+
- [Await](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await)
1228+
11851229
## Glossary
11861230

11871231
### <a name="scope_def"></a> Scope

0 commit comments

Comments
 (0)