Commit 6272098c authored by kael_k's avatar kael_k

Added async.md

parent a7a17092
Pipeline #687 passed with stage
in 1 minute and 30 seconds
<!doctype html>
<head>
<!-- template override, need bigger height for code -->
<style>
.reveal pre code{
max-height: 600px !important;
}
.reveal blockquote {
width: 100% !important;
padding: 0.75em !important;
}
.small{
font-size: 0.75em
}
</style>
<meta charset="utf-8"/>
<meta content="" name="description"/>
<meta content="" name="author"/>
......@@ -104,6 +90,52 @@
});
});
</script>
<!-- template override, need bigger height for code -->
<style>
.reveal pre code{
max-height: 600px !important;
}
.reveal blockquote {
width: 100% !important;
padding: 0.75em !important;
}
.small{
font-size: 0.75em
}
.outro{
display: flex;
flex-direction: column;
}
.outro > h1 {
font-size: 2em;
}
.outro > .outro-container {
flex-grow: 1;
align-items: center;
display: flex;
flex-direction: row !important;
}
.outro-container > .outro-logos {
width: 30%;
}
.outro-container > .outro-content {
width: 70%;
}
.outro > .license {
margin: 20px 0 10px;
color: #aaa;
font-size: 0.5em
}
.outro > .license p {
margin: 0;
}
</style>
</head>
<div class="reveal">
......@@ -126,6 +158,12 @@
data-separator="^\r?\n---\r?\n$"
data-separator-notes="^Notes:"
data-separator-vertical="^\r?\n----\r?\n$">
</section>
<section data-charset="utf-8"
data-markdown="./slides/content/async.md"
data-separator="^\r?\n---\r?\n$"
data-separator-notes="^Notes:"
data-separator-vertical="^\r?\n----\r?\n$">
</section>
<section data-charset="utf-8"
data-markdown="./slides/content/demo.md"
......
# Promises
----
## Promises
The great event-driven nature of node.js is also reflected in the native objects and its syntax.
----
## Promises
### the `Promise` object
A `Promise` instance is an object which you can chain multiple handler with `.then` to execute **sequentially** and **asynchronously** and `.catch` to intercept errors in the various promises.
The value returned from the previous promise is passed to the next promise as a function parameter.
----
## Promises
### the `Promise` object
```js
doSomething()
.then(function(result) {
return doSomethingElse(result);
})
.then(function(newResult) {
return doThirdThing(newResult);
})
.then(function(finalResult) {
console.log('Got the final result: ' + finalResult);
})
.catch(failureCallback);
```
> Example from: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises#chaining)
----
## Promises
### creating a `Promise`
In order to create a promise, we have to create a new instance of `Promise` and define when it is successful or to reject (error).
```js
const myPromise = new Promise((resolve, reject) => {
// code...
if(ok){
resolve(result);
}else{
reject(error)
}
})
```
----
## Promises
### creating a `Promise`
The creation of a new Promise as in the example is essential when you have to wrap the old code (which is async but does not return a promise).
----
## Promises
### creating a `Promise`
A very trivial example where it makes sense to use a promise is to wrap setTimeout.
```js
ms => new Promise(resolve => setTimeout(resolve, ms))
```
> Example from: [MDN](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Using_promises#creating_a_promise_around_an_old_callback_api)
----
## Promises
### creating a `Promise`
However, generally speaking you can use a much more "lighter" alternative syntax...
----
## Promises
### `async` and `await` keywords
In fact, in the ES2017 were added the `async` and `await` keyword in order to smooth the syntax.
----
## Promises
### `async` and `await` keywords
```js
async function veryLongAsyncFunction(){
veryLongFunction()
veryLongFunction()
//...
}
veryLongAsyncFunction()
```
----
## Promises
### `async` and `await` keywords
What async does is to turn a function in a `Promise`.
Moreover, in every `async function` block is possible to `await` other promises.
The `await` keyword allow the function to wait the fulfillment and to access directly to the returned value of the promise.
----
## Promises
### `async` and `await` keywords
```js
import fs from "fs/promises"
fs.readFile("file1.txt")
.then( async (f1) => {
const f2 = await fs.readFile("file2.txt")
return "" + f1 + f2
})
// print file1.txt and file2.txt concat
.then( e => console.log(e))
// if something go wrong, print the error
.catch( err => console.error(err) )
```
\ No newline at end of file
......@@ -311,8 +311,7 @@ npm i --only=production
## npm
### `npm run` scripts
Through the `package.json`, you can write "package specific script".
Through the `package.json`, you can write "package specific script".
This can come in handy when, in order to run your project, you want a simple alias to execute a long command.
```json
......
......@@ -167,12 +167,10 @@ class Animal {
constructor(name) {
this.name = name;
}
speak() {
console.log(this.name + ' makes a noise.');
}
}
class Dog extends Animal {
speak() {
console.log(this.name + ' barks.');
......
<section class="intro">
<h1>Corsi Node.js</h1>
<h1>Node.js courses</h1>
<h2>Introduction to Node.js</h2>
<img src="./poul/img/logo-text-white.svg"/>
......
# Thank you!
<section class="outro">
<h1>Thank you!</h1>
<div class="outro-container">
<div class="outro-logos">
<img src="./poul/img/logo-text-white.svg"/>
<img class="logo" src="./poul/img/logo-notext-white.svg"/>
</div>
<div class="outro-content">
<h3>Node.js courses</h3>
<h4>Introduction to Node.js</h4>
<img src="./poul/img/logo-text-white.svg"/>
<img class="logo" src="./poul/img/logo-notext-white.svg"/>
<p class="small">D'Alcamo Kael &lt;dalcamokael@gmail.com&gt;</p>
----
<h4>Special thanks for the collaboration to:</h4>
<ul style="list-style: none" class="small">
<li>Roberto Bochet &lt;avrdudo@poul.org&gt;</li>
<li>Frederik Saraci &lt;kek@infokek.tk&gt;</li>
<li>Raffaele Di Campli &lt;dcdrj.pub@gmail.com&gt;</li>
</ul>
</div>
</div>
## Node.js courses
### Introduction to Node.js
<p class="small">D'Alcamo Kael &lt;dalcamokael@gmail.com&gt;</p>
#### Special thanks for the collaboration to:
<ul style="list-style: none" class="small">
<li>Roberto Bochet &lt;avrdudo@poul.org&gt;</li>
<li>Frederik Saraci </li>
<li>Raffaele Di Campli &lt;dcdrj.pub@gmail.com&gt;</li>
</ul>
<div class="small">
<p>Released under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International license</p>
<img class="cc" src="./poul/img/creativecommons-by-nc-sa.svg" style="width: 200px"/>
</div>
<div class="license">
<p>Released under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International license</p>
<img class="cc" src="./poul/img/creativecommons-by-nc-sa.svg" style="width: 100px"/>
</div>
</section>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment