async / await

Cómo usar Async / Await para escribir un código mejor en JavaScript

async: La palabra “async” ante una función significa solamente una cosa: que la función siempre devolverá una promesa. Otros valores serán envueltos y resueltos en una promesa automáticamente.

Por ejemplo, esta función devuelve una promesa resuelta con el resultado de 1

const returOne = async () => {
  return 7;
}

returOne().then(console.log()); // 7

Es lo mismo que esto:

const returTwo = () => {
  return Promise.resolve (2);
}

returTwo().then(console.log()); // 2

async se asegura de que la función devuelva una promesa, o envuelve las no promesas y las transforma en una. Bastante simple, ¿correcto? Pero no solo eso. Hay otra palabra, await, que solo trabaja dentro de funciones async y es muy interesante. await hace que JavaScript espere hasta que la promesa responda y devuelve su resultado.

OJO con esto:

const showNumber = () => {
  return new Promise(resolve => {
    setTimeout(()=> {
      resolve('999999');
    }, 5000)
  })
}

const msg = async () => {
  const msg =await showNumber(); ---> Esperará 5 segundos y luego mostrará 'Message' '999999'
  console.log('Message', msg);
}
msg().then(console.log('HOOOOOOOLAAAAAAAA')); ---> El then no hace que se espere los 5 segundos....

ASINCRONO: pueden suceder varias cosas relacionadas sin esperar a que se complete la acción anterior.

Cómo funcionan las promesas en JavaScript

El objeto Promise en JavaScript representa una operación asíncrona (y su valor resultante) que eventualmente se completará (o fallará).

Una Promise puede estar en uno de estos estados:

• pending (pendiente): estado inicial, ni cumplida ni rechazada.
• fulfilled (cumplida): significa que la operación se completó con éxito.
• rejected (rechazada): significa que la operación falló.

Link interesante: 

Más link