Introducción

1

Historia de JavaScript: ¬Ņqu√© es ECMAScript?

2

¬ŅQu√© es el TC39?

Configuracion

3

Configurando nuestras herramientas

¬ŅQu√© se implement√≥ en ES6?

4

ES6: generator

5

ES6: let y const, y arrow functions

6

ES6: strings

7

ES6: par√°metros por defecto

8

ES6: asignación de desestructuración

9

ES6: spread operator

10

Playground: Combina objetos JSON con el Spread Operator

11

ES6: clases

12

ES6: object literals

13

ES6: promesas

14

ES6: module

15

Playground: Obtén una lista de películas

16

ES6: clases

17

ES6: clases

18

ES6: generator

19

Playground: Generador de identificadores para michis

20

ES6: set-add

¬ŅQu√© se implement√≥ en ES7?

21

ES7: exponentiation operator y array includes

¬ŅQu√© se implement√≥ en ES8?

22

ES8: object entries y object values

23

ES8: string padding y trailing commas

24

ES8: funciones asíncronas

¬ŅQu√© se implement√≥ en ES9?

25

ES9: expresiones regulares

26

ES9: Promise.finally

¬ŅQu√© se implement√≥ en ES10?

27

ES10: flat-map y trimStart-trimEnd

28

ES10: try catch y fromEntries

¬ŅQu√© se implement√≥ en ES11?

29

ES11: optional chaining

30

ES11: BigInt y Nullish

31

ES11: Promise.allSettled

32

ES11: globalThis y matchAll

33

ES11: dynamic Import

¬ŅQu√© se implement√≥ en ES12?

34

ES12: numeric-separators y replaceAll

35

ES12: promise-any y métodos privados

¬ŅQu√© se implement√≥ en ES13?

36

ES13: at

37

ES13: top level await en el consumo de una API

Recapitulación

38

Performance

No tienes acceso a esta clase

¬°Contin√ļa aprendiendo! √önete y comienza a potenciar tu carrera

Reg√°late acceso ilimitado a todos los cursos por 1 a√Īo a precio especial de Navidad ūüéĄ

Antes: $199

Currency
$149/a√Īo
regístrate

termina en:

16D
15H
10M
26S

ES9: Promise.finally

26/38
Recursos

Las siguientes características de ES9 o ES2018 que aprenderás son: método finally para promesas y generadores asíncronos.

Método finally en promesas

El método finally para promesas consiste en ejecutar código después que una promesa haya sido ejecutada como resuelta o rechazada.

promesa()
    .then(response => console.log(response) // Promesa resuelta
    .catch(error => console.log(response) // Promesa rechazada
    .finally( () => console.log("Finalizado") ) // Código final  

Generadores asíncronos

Los generados asíncronos son semejantes a los generadores que ya conoces, pero combinando sintáxis de promesas.

async function* anotherGenerator() {
  yield await Promise.resolve(1)
  yield await Promise.resolve(2)
  yield await Promise.resolve(3)
}

const generador = anotherGenerator()
generador.next().then(respuesta => console.log(respuesta.value))
generador.next().then(respuesta => console.log(respuesta.value))
generador.next().then(respuesta => console.log(respuesta.value))

Cómo utilizar for await

De la misma manera, for await es un ciclo repetitivo que se maneja asíncronamente. El ciclo siempre debe estar dentro de una función con async.

El valor es cada elemento del iterable puede tener cualquier nombre, por eso se inicia con let nombre.

async function forAwait() {
  const nombres = ["Alexa", "Oscar", "David"]
  for await (let valor of nombres) {
    console.log(valor)
  }
}

forAwait()

Cursos para entender el asincronismo en JavaScript

Si a√ļn no sabes en qu√© consiste el asincronismo, no te preocupes, existen cursos completos de este tema.

Contribución creada por Andrés Guano (Platzi Contributor).

Aportes 7

Preguntas 3

Ordenar por:

Los aportes, preguntas y respuestas son vitales para aprender en comunidad. Regístrate o inicia sesión para participar.

En el minuto 2:53 dice que no entro en el catch… OJO esto puede confundir! Si entro en el catch!..

Se genero un reject porque la condicion era false, por lo cual el catch lo ataja…

Una manera de verlo podria ser agregar marca en los console.log y probar los 2 casos…

const anotherFunction = () => {
    return new Promise((resolve, reject) => {
        if (true) {
            resolve("Hey");
        } else {
            reject("Whooops!");
        }
    })
}

anotherFunction()
    .then(response => console.log('Then...' + response))
    .catch(err => console.log('catch...' + err))
    .finally(()=> console.log('Finally'));

Nuevamente, siento que este concepto lo podemos ver como un lifecycle también.

Hola Chicos ūüėÉ

ES9

  • Finally
const anotherFuncion = () => {
    return new Promise((resolve, reject) => {
        if (false) {
            resolve("hey!!");
        } else {
            reject ( "whooooops!");
        }
    })
}

anotherFuncion()
.then(response => console.log(response))
.catch(err => console.log(err))
.finally(() => console.log("finally"));
  • Async
async function* anotherGenerator() {
    yield await Promise.resolve(1);
    yield await Promise.resolve(2);
    yield await Promise.resolve(3);
}

const other = anotherGenerator();
other.next().then(response => console.log(response.value));
other.next().then(response => console.log(response.value));
other.next().then(response => console.log(response.value));
console.log("hello");

async function arrayOfNames(array) {
    for await (let value of array) {
        console.log(value);
    }
}

const names =arrayOfNames(["Alexa", "Oscar", "David"]);
console.log("After");

.finally es util cuando quieren hacer una acción sin importar si la respuesta fue correcta o no. Tal vez el cierre de una conexión a BD o actualizar un estado de loading cuando hicieron una llamada a la base de datos

El finally se ejecuta Despues de que la promesa ocurre, independientemente si hubo un resolve o reject, si la promesa no ocurre entonces no entra en finally, para entenderlo agregue un setTimeout(), y probe con true y false:

const anotherFunction = () => {
    return new Promise((resolve, reject) => {
        if (true) {
            setTimeout(() => resolve('Hey!!'), 2000)
        } else {
            setTimeout(() => reject("Whooops!"), 5000)
        }
    })
}

anotherFunction()
    .then(response => console.log('Then...' + response))
    .catch(err => console.log('catch...' + err))
    .finally(()=> console.log('Finally'));

Algo que no dijo el instructor, es que si vuelves a llamar la funcion con next, te devuelve undefined.

async retorna un objeto Promise, por eso si funciona si quitamos el await

async function* generator(){
    yield Promise.resolve(1)
   yield Promise.resolve(2)
   
    
}

const gen= generator()

gen.next().then(x=>console.log(x.value))
gen.next().then(x=>console.log(x.value))