No tienes acceso a esta clase

隆Contin煤a aprendiendo! 脷nete y comienza a potenciar tu carrera

Adquiere por un a帽o todos los cursos, escuelas y certificados por un precio especial.

Antes: $249

Currency
$219/a帽o

Paga en 4 cuotas sin intereses

Paga en 4 cuotas sin intereses
Comprar ahora

Termina en:

0D
1H
41M
43S

Async/await

10/31
Recursos

Aportes 133

Preguntas 18

Ordenar por:

驴Quieres ver m谩s aportes, preguntas y respuestas de la comunidad?

o inicia sesi贸n.

Me parece importante marcar que para este caso de aplicaci贸n no es necesario declarar las funciones hola(), hablar() y adios() como async, ya que en ning煤n momento estamos haciendo un await dentro de las mismas, s贸lo devuelven las promesas.

increible explicacion me quedo mas claro que en el curso de asincronismo 馃槂

RESUMEN:


Para evitar que todo se vea as铆ncrono, y que la sint谩xis sea m谩s legible las operaciones secuenciales como hacer un archivo que se procese, subirlo para tener una URL y de ah铆 mandarla a una base de datos.
Async y Await nos permite definir una funci贸n de forma expl铆cita como as铆ncrona y esperar a que la funci贸n termine. No estar谩 bloqueando el hilo principal, pues estar谩 esperando a que se resuelva con el event loop

// La palabra async  la convierte inmediatamente en as铆ncrona.
async function hola(nombre) {
    return new Promise(function (resolve, reject) {
        setTimeout(function () {
            console.log('Hola, '+ nombre);
            resolve(nombre);
        }, 1500);
    });
}

async function hablar(nombre) {
    return new Promise( (resolve, reject) => {
        setTimeout(function() {
            console.log('Bla bla bla bla...');
            resolve('Hay un error');
        }, 1000);
    });
}

async function adios(nombre) {
    return new Promise( (resolve, reject) => {
        setTimeout(function() {
            console.log('Adios', nombre);
            resolve();
        }, 1000);
    });
}


// Await solo es v谩lido dentro de una funci贸n as铆ncrona.
async function main() {
    let nombre = await hola('Alejandro');
    await hablar();
    hablar(); // Para hacer que se ejecute en segundo plano no debe existi el await
    await hablar();
    await adios(nombre);
    console.log('Termina el proceso');
}

// Esto nos permitir谩 saber si nuestra funci贸n se est谩 ejecutanod de forma as铆ncrona.
console.log('Empezamos el proceso');
main();
console.log('Va a ser la segunda instrucci贸n')

Asyn/Await es azucar sintactico, es decir, una forma muy legible y entendible de realizar c贸digo, un Async/Await no deja de ser una funci贸n as铆ncrona, la diferencia es que al usar esta sintaxis se podr谩 ver un c贸digo m谩s legible.
Para usar correctamente esta sintaxis usamos Async para declarar una funci贸n as铆ncrona, cuando una funci贸n es as铆ncrona podremos usar dentro de su contexto el Await.
El Await es la manera en que le indicaremos a nuestro c贸digo que ha de 鈥渆sperar鈥 a que el evento al cual le indiquemos Await es importante para el proceso del c贸digo, por ende, para poder seguir ejecutando el proceso espere a que el evento se resuelva y retorne un valor.
Cuando este retorne un valor el c贸digo seguir谩 normalmente.
Let nombre = 鈥榊ourName鈥;
Async helloWorld(nombre){
Await resolveName(nombre)
whoAreYou(nombre); <-- esta funci贸n no se ejecutara hasta que el await se resuelva.
}

async await, async await, async await, async await鈥 En la jungla tan imponente el le贸n rey duerme ya鈥

Creo que no era necesario definir como funciones as铆ncronas a hola, hablar y adios, simplemente con definir como as铆ncrona a la funci贸n que va a ejecutar las otras (main) es suficiente para usar el await.

Aca dejo un video de Leonidas Esteban sobre async await que est谩 muy bueno: https://www.youtube.com/watch?v=E5ENWEcoDdI 馃槂

En inform谩tica, el az煤car sint谩ctico es un t茅rmino acu帽ado por Peter J. Landin en 1964 para referirse a los a帽adidos a la sintaxis de un lenguaje de programaci贸n dise帽ados para hacer algunas construcciones m谩s f谩ciles de leer o expresar. Esto hace el lenguaje 鈥渕谩s dulce鈥 para el uso por programadores: las cosas pueden ser expresadas de una manera m谩s clara, m谩s concisas, o de un modo alternativo que se prefiera, sin afectar a la funcionalidad del programa.

Fuente: Wikipedia

Async/await


La sintaxis de Async/await nos va a permitir definir una funci贸n de forma expl铆cita como funci贸n as铆ncrona y poder esperar a que esa funci贸n termine.

async function hola(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(`Hola, ${nombre}`)
            resolve(nombre)
            reject('No s茅 qu茅 paso')
        }, 1500)
    })
}

async function hablar(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(`Bla bla bla bla...`)
            resolve(nombre)
        }, 1000)
    })
}

async function adios(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(`Adi贸s, ${nombre}`)
            resolve()
        }, 1000)
    })
}

async function main() {
    let nombre = await hola('Carlos')
    await hablar()
    await hablar()
    await hablar()
    await hablar()
    await adios(nombre)
}

console.log('Empezamos el proceso')
main()
console.log('Terminamos el proceso')

Descubre el secreto del sabio Math:

const numfrases = 20;

//arreglo de frases sabias
const SmartArrayFrases = [
    '1. No hay que ir para atr谩s ni para darse impulso (Lao Ts茅) Una frase motivadora que aconseja seguir siempre nuestro camino a pesar de las adversidades.',
    '2. No hay caminos para la paz; la paz es el camino (Mahatma Gandhi) Gandhi nos dej贸 para la historia esta preciosa frase sobre la paz.  ',
    '3. Haz el amor y no la guerra (John Lennon) El cantante John Lennon siempre tuvo una mentalidad pacificadora.  ',
    '4. Para trabajar basta estar convencido de una cosa: que trabajar es menos aburrido que divertirse (Charles Baudelaire)  El trabajo, a pesar de que siempre apetezca hacerlo, es bueno para nuestra salud mental.',
    '5. Lo peor que hacen los malos es obligarnos a dudar de los buenos (Jacinto Benavente)  Siempre es mejor ser honrado aunque a veces podamos creer lo contrario.',
    '6. Las guerras seguir谩n mientras el color de la piel siga siendo m谩s importante que el de los ojos (Bob Marley)  El racismo y los prejuicios han sido la causa de muchas guerras.',
    '7. Aprende a vivir y sabr谩s morir bien (Confucio)  La vida hay que disfrutarla en cada momento y no estar muerto en vida.',
    '8. Cada d铆a sabemos m谩s y entendemos menos (Albert Einstein)  No importa que cada vez haya m谩s conocimiento si no lo sabemos aplicar.',
    '9. El mundo no esten peligro por las malas personas sino por aquellas que permiten la maldad (Albert Einstein)  Siempre habr谩 gente mala, pero no podemos dejar que triunfen.',
    '10. La medida del amor es amar sin medida (San Agust铆n)  Una frase rom谩ntica que significa que debemos amar con todo.',
    '11. No hay nada que un hombre no sea capaz de hacer cuando una mujer le mira (Casanova)  El amor de un hombre por una mujer es capaz de mover el mundo.',
    '12. Dar el ejemplo no es la principal manera de influir sobre los dem谩s; es la 煤nica manera. (Albert Einstein)  A la hora de educar, es necesario que nosotros mismos seamos coherentes con lo que pretendemos ense帽ar.',
      ]

//funcion de saludo param茅trica, hola y adios son lo mismo, un saludo, solo cambia el tipo mensaje.
async function Saludo(tipo,nombre) {
    return new Promise((resolve, reject)=>{
        setTimeout(function() {
            console.log(tipo + " " + nombre);
            resolve(nombre);
        }, 100)
    });
}

// hablar es la accion de emplear la funcion de las frases
async function hablar() {
    return new Promise((resolve, reject)=>{
        setTimeout(function() {
           frases()
        }, 100);
    })
}

//una conversacion es un grupo de frases organizadas de alguna manera 
async function conversacion(veces) {
    return new Promise((resolve, reject)=>{   
        setTimeout(function() {
            if (veces >= 1) {
                hablar()
                switch(veces){
                   case numfrases:
                       console.log("-- Dice el primer sabio:")  
                    break;
                   case 1:
                       console.log("-- Dice el 煤ltimo sabio:")
                    break;
                   default:
                       console.log("-- Dice el siguiente sabio:")
                    break;
                } 
                conversacion(--veces)
            } else {
              Saludo("Adios", "Eruditos, los sabios HAN DICHO o quiz谩s no...");
            }
           //resolve(conversacion());
        }, 100);
    })
}

// los sabios escogen frases aleatorias
function frases(){    
    //let i = Math.floor(Math.random() * SmartArrayFrases.length) Secreto de sabio

    let i = Math.round(Math.random() * SmartArrayFrases.length)
    if(SmartArrayFrases[i]){
        return console.log(SmartArrayFrases[i]) ;
    }else{
        return console.log("Algun sabio mantuvo el silencio, su secreto es que no sabia usar bien el math para escoger las frases, 驴podr谩s ayudarlo?")
    }
}

//maine capital augusta
async function Main(){
    await Saludo("Bienvenidos", "Viajeros estelares")
    await conversacion(numfrases);
}

Main();

Por si gustan usar tambien el try-catch

async function main() {
  try {
    let nombre = await hola("Simon");
    await hablar();
    await hablar();
    await hablar();
    await adios(nombre);
  } catch (error) {
    console.log("Error");
  }
}```

Comparto un post que explica un poco m谩s de promesas y async await. Espero les guste y puedan dejar feedback!

https://platzi.com/tutoriales/1789-asincronismo-js/5063-las-promesas-y-async-await-logicamente-no-son-iguales-y-te-explico-el-porque/

Tomen lo que voy a decir como un comentario super positivo para el profesor(lo comento porque no quiero salir mal parado)
Este es mi vig茅simo curso, he tomado cursos desde html y css, hasta cursos de niveles ya avanzado en vue, y es que en todo los cursos de javascript explican este concepto, y este es el profesor que m谩s errores y dificultades ha tenido a lo largo de su explicaci贸n Y NO ENTIENDO el POR QU脡 PERO ES AL QUE MEJOR LE HE ENTENDIDO LA ASINCON脥A, ES FANT脕STICO, GRACIAS CARLOS
Psdta. me imagino a Freddy en todos los cursos de js diciendo, vas a ense帽ar callback, promise y async await y te va a gustar jajajajajajaja

Sintaxis para el manejo de errores =)
await foo().catch(error => console.log(error));

async function hello(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("hello", name);
      resolve();
    }, 1500);
  });
}

async function speaks(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("bla bla bla...");
      resolve(name);
    }, 1000);
  });
}

async function bye(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("bye", name);
      resolve();
    }, 1000);
  });
}

async function main() {
  let name = await hello("George");
  await speaks();
  await speaks();
  await speaks();
  await bye(name);
  console.log("End process");
}

console.log("Init process");
main();

He seguido toda la ruta de la escuela de JavaScript y ha servido como complemento perfecto de los otros cursos.

Me queda super claro todo.

Async y Await nos permite definir una funci贸n de forma expl铆cita como as铆ncrona y esperar a que la funci贸n termine.

La palabra await solo funciona dentro de una funci贸n as铆ncrona.

https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Asynchronous/Async_await

Hay dos partes para usar async / await en su c贸digo.

<h4>La palabra clave asincr贸nica</h4>

En primer lugar tenemos la聽asyncpalabra clave, que pones delante de una declaraci贸n de funci贸n para convertirla en una聽funci贸n as铆ncrona聽.聽Una funci贸n as铆ncrona es una funci贸n que sabe c贸mo esperar la posibilidad de que la聽awaitpalabra clave se utilice para invocar c贸digo as铆ncrono.

Entonces, la async palabra clave se agrega a las funciones para decirles que devuelvan una promesa en lugar de devolver directamente el valor.

<h4>La palabra clave de espera</h4>

La ventaja real de las funciones as铆ncronas se hace evidente cuando las combina con la聽palabra clave聽await聽; de hecho,聽awaitsolo funciona dentro de las funciones as铆ncronas聽.聽Esto se puede poner delante de cualquier funci贸n asincr贸nica basada en promesas para pausar su c贸digo en esa l铆nea hasta que se cumpla la promesa, luego devolver el valor resultante.

Puede usarlo聽awaital llamar a cualquier funci贸n que devuelva una promesa, incluidas las funciones de API web.

Hoy por fin entend铆 totalmente el async/await

Con Async / Await podemos tratar funciones as铆ncronas como si fuesen s铆ncronas y que la sint谩xis sea m谩s legible.

Las funciones con Async / Await no estar谩n bloqueando el hilo principal, pues estar谩n esperando a que se resuelva con el event loop.

Partiendo de las funciones con las que hemos estado trabajando鈥

function hola(nombre) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('Hola, ' + nombre);
      resolve(nombre);
    }, 1500);
  });
}

function adios(nombre) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('Adios, ' + nombre);
      resolve();
    }, 1000);
  });
}

function hablar(nombre) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('Bla Bla Bla Bla Bl谩...');
      resolve(nombre);
      /* reject('Hay un error'); */
    }, 1000);
  });
}

鈥 vamos a usar una funci贸n llamada 鈥渕ain鈥 para llamarlas de usando await, sin embargo a esta funci贸n hay indicarle explicitamente que tendr谩 un comportamiento as铆ncrono y va a esperar la respuesta de sus llamadas, por eso al lado de 鈥渇unction鈥 le ponemos la palabra reservada 鈥渁sync鈥.

async function main() {
  let nombre = await hola('Jorge');
  await hablar();
  await hablar();
  await hablar();
  await adios(nombre);
  console.log('Terminamos el proceso');
}

A帽adimos la respuesta de la funci贸n as铆ncrona hola a una variable llamada 鈥渘ombre鈥 para poder utilizarla en la funci贸n adios.

Por 煤ltimo solo hay que llamarla para ver los resultados.

console.log('Empezamos el proceeso...');
main();
console.log('Va a ser la segunda instrucci贸n que se ejecute');

En consola, obtendr铆amos la siguiente respuesta:

Date cuenta que la respuesta se muestra de forma sincrona. La funci贸n hola, a煤n cuando tarda 1500 ms y las dem谩s solo 1000, es la que primero se muestra. La respuesta seguir谩 el orden en el que fueron declaradas las funciones.

Saludos compa帽eros, el tema de async y await es un tanto tricky con respecto a como es que trabaja await. Lo entend铆 despues de estar experimentandolo y me gustar铆a hacer un aporte a la comunidad compartiendo mis apuntes con respecto a este tem, espero les sirva.
Por medio de async se indica que la funci贸n correra de manera as铆ncrona y con await lo que se har谩 es que las funciones que hagan peticiones a una api u otra cosa de manera as铆ncrona quien tenga el await esperar谩 que los anteriores terminen su funci贸n y tambi茅n har谩 que las siguientes funciones deban esperar a que esa funci贸n termine. Por ello las siguientes im谩genes tienen sentido.

const goingOutside = async () => {
    try {
        leave();
        walkingTimer();
        console.log("Good evening1");
        await pickUp();
        pickUp();
        journeyCar();
        console.log("Good evening2");
    }
    catch {
        console.error("Hay un error.")
    }
}
goingOutside();

Aparece primero Good evening1 porque las funciones que est谩n atr谩s del await van a tardar y est谩n trabajando fuera del call stack y lo que se puso dentro del call stack fue

        console.log("Good evening1");

Y luego se imprimen las dem谩s sin un orden determinado solo seg煤n como tarde cada funci贸n en acabar su tarea. Y como ahora terminaron todas las funciones que estaban antes del await rec铆en empezar谩 la funci贸n

  await pickUp();

Y cuando reci茅n termine es cuando las funciones que est谩n delante de esta empezar谩n a funcionar y como cada una est谩 fuera del call stack y quien si est谩 es

 console.log("Good evening2");

por ello es quien se imprime y luego de ello se imprimen los dem谩s en funci贸n de cuanto tarden.

No deja de sorprenderme la actitud del profesor, incre铆ble. 馃憦馃徏

Miren algo cruioso de este codigo, cuando colocamos await en la primera y ultima funcion tomas las que estan intermedias como si fuesen asincronas

async function hi(nombre){
    return new Promise((resolve, reject)=>{
        setTimeout(() => {
            console.log(`Hola, ${nombre}`);
            resolve(nombre);
        },1000)
    })
}

async function talk (nombre){
    return new Promise ((resolve,reject)=>{
        setTimeout(()=>{
            console.log('bla bla bla bla bla bla');
            resolve(nombre);
            // reject('hay un error')
        },1000)
    })
}

async function bye(nombre) {
    return new Promise((resolve,reject)=>{
        setTimeout(() => {
            console.log(`Adios ${nombre}`);
            resolve();
        }, 1000);
    })
}
async function main (){
    let nombre = await hi('David');
    talk();
    talk();
    await bye(nombre);
    console.log('Terminamos el proceso');
}
console.log('Empezamos el proceso');
main();


// Async/await

// Asyng y await utilizados para evitar el uso de funciones dentro de funciones para evitar mucho texto

function Hello_A(name){
    return new Promise (function (resolve, reject){
        setTimeout(function() {
            console.log('Hello, ' + name);
            resolve(name);
        },1000);
        // Se utiliza en una zona la cual llegue el programa al fallar.
        // Reject('Hay un error?)
    });
}

function Conversation_A() {
    return new Promise ((resolve, reject) => {
            console.log('Bla Bla Bla..');
            resolve();
    });
}

function Goodbye_A(name){
    return new Promise (function (resolve, reject){
        setTimeout(function() {
            console.log('Goodbye, ' + name);
            resolve();
        },1000);
    });
}

//Asyng es la palabra que utlizamos antes de una funcion para denotar que utilizaremos await
//Await es la palabra que utilizamos antes de nombrar una funcion para que se vuelva sincronas y se ejecunten una tras otra

async function main(){
    let name = await Hello_A('Owen');
    for(let i = 0; i < 3 ; i++){
        await Conversation_A();
    }
    await Goodbye_A(name);
}

main();

Nota: actualmente con el est谩ndar ECMAScript 2022 es posible usar el await por fuera de funciones as铆ncronas.

Profesor: Con esto podemos convertir procesos as铆ncronos en aparentemente as铆ncronos. Pero nuestra funci贸n es as铆ncrona.
Yo 馃槷

Para el manejo de errores (tal como lo hicimos con .catch() en las Promises) ser铆a el uso de bloques try y catch, de esta manera manejamos tanto errores en c贸digo como rejects de las promesas.

async function hola(nombre){
return new Promise(function(resolve,reject){
setTimeout(function(){
console.log('hola, '+nombre);
resolve(nombre);
},1000);
});
}
async function hablar(nombre) {
return new Promise((resolve,reject)=>{
setTimeout(function () {
console.log(鈥榖la bla bla bla鈥︹);
resolve();
},1000);
});
}
async function adios(nombre) {
return new Promise((resolve,reject)=>{
setTimeout(function () {
console.log(鈥榓dios鈥,nombre);
resolve();
},1000);
});
}

//lo que se ejecutara鈥

async function main(){
let nombre =await hola(鈥楥arlos鈥);

await hablar();
await hablar();
await hablar();
await adios(nombre);
console.log('Terminando el Proceso...')

}
console.log(鈥業niciando el Proceso鈥︹)
main();

Es bueno entender que async/await hace parecer al proceso s铆ncrono, por lo que algunos beneficios de la concurrencia se pueden perder. Como decia tio Ben:

Todo poder conlleva una responsabilidad

Aqu铆 dejo un ejemplo:

const print = (msg) => {
    console.log(msg);
    return msg;
}

const future_message = () => {
    return new Promise((resolve, reject) => 
        setTimeout(() => resolve(print("Genesys is Skynet")), 3000));
}

async function main(){
    const msg = await future_message()
    console.log("Hello to the program!")
    console.log("msg: ", msg)
}

main()```

El programa imprimir谩


Genesys is Skynet
Hello to the program!
msg: Genesys is Skynet


Si usamos then en lugar de await 

const print = (msg) => {
console.log(msg);
return msg;
}

const future_message = () => {
return new Promise((resolve, reject) =>
setTimeout(() => resolve(print(鈥淕enesys is Skynet鈥)), 3000));
}

function main(){
future_message().then((msg) => console.log("msg: ", msg));
console.log(鈥淗ello to the program!鈥)
}

main()


la salida ser

Hello to the program!
Genesys is Skynet
msg: Genesys is Skynet```

Entendiendo la naturaleza del programa podemos combinar los dos m茅todos de la mejor manera

Yo solo quiero pegar mi codigo en todas partes
Asinc Await nos permite usar promesas de una manera mas f谩cil de leer.

async function main(){
  const response = await hola('Adranuz')
  await hablar()
  await hablar()
  await hablar()
  await hablar()
  await adios(response)
  console.log('Terminando el proceso')
  
}
console.log('Comenzando el proceso')
main()
console.log('Verificando asincronismo')

As铆 ser铆a mucho m谩s f谩cil la explicaci贸n.

const doSomenthingAsync = () => {
	return new Promise ( resolve => {
		setTimeout( () => resolve ('I did something async'), 2000)
	});
}

const doSomething = async () => {
	console.log(await doSomenthingAsync());
}

doSomething()  //para ejecutar la funci贸n

//procesos a sincronos pero visualemnte sincronos
async function main(){
   //la funcion hola  repsonde el nombr eingresado y se guarda en una variable.
    let nombre=await hola("Alexis");
    await hablar();
    await hablar();
    await hablar();
    await hablar();
    await adios(nombre);
    console.log('Terminasmos...')
}

console.log('empezamos el proceso...')
main();```

muy interesante el planteamiento

async function hola(nombre, micallback) { 
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            if (true) {
                console.log(`hola ${nombre}`);   
                resolve(nombre); 
            } else {
                reject('Error al saludar');
            }
            
        }, 1000);
    });
}

async function hablar(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            if (true) {
                console.log('bla bla bla bla');
                resolve(nombre);
            } else {
                reject('Error encontrado al hablar');
            }
            
        }, 500);
    });
}

async function adios(nombre, otrocallback) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            if (true) {
                console.log(`Adios ${nombre}`)
                resolve();
            } else {
                reject('error al despedirse');
            }
            
        }, 2000);
    });
}

function conversacion(nombre, veces, callback) {
   if (veces >0) {
       hablar(() => { 
           conversacion(nombre, --veces, callback);
       })
   } else {
       adios(nombre, callback);
   }
  
}

async function main() {
    let nombre = await hola('Francisco');
    await hablar();
    await hablar();
    await hablar();
    await hablar();
    await hablar();
    await adios(nombre);
    console.log('adios await');
}

console.log('hola async');
main();

Alguien sabe por sin poner la palabra async en las tres primeras funciones sigue funciona de forna asincrona?

function hola (name) {
    return new Promise((resolve, reject)=>{
        setTimeout(_=>{
            console.log(`Hola ${name}`);
            resolve(name);
        }, 1000);
    })
}

function hablar(){
    return new Promise((resolve, reject)=>{
        setTimeout(()=>{
            console.log(`Bla Bla bla ....`);
            resolve();
            // reject(`hubo un error`)
        },1000)
    })
}

function adios (name){
    return new Promise((resolve, reject)=>{    
        setTimeout(_=>{
            console.log(`Adios ${name}`)
            // reject(`huvo error`);
            resolve();
        }, 1000) 
    })
}

async function main(){
    let name = await hola(`Carlos`);
    await hablar();
    await hablar();
    await hablar();
    await adios(name);
    console.log(`Terninamos el proceso`);
}
console.log(`Empesamos el proceso`);
main();
function love() {
    return new Promise(resolve => {
        setTimeout(() => {
            resolve('鈾ワ笍');
        }, 2000);
    });
}

async function msg() {
    const msg = await love();
    console.log(msg);
}
msg(); // Message: 鈾ワ笍 <-- after 2 seconds```

Tambi茅n podemos utilizar el try / catch de una funci贸n async:

async function hola(nombre) {
  try {
    setTimeout(() => {
      console.log("Hola", nombre)
    }, 1000)
  } catch (err) {
    console.log(err)
  }
}

async function hablar(nombre) {
  return new Promise(function (resolve, reject) {
    setTimeout(() => {
      console.log("bbla bla bla bla")
      resolve(nombre)
      // reject("Hay un error")
    }, 1000)
  })
}

async function adios(nombre, otroCallback) {
  return new Promise(function (resolve, reject) {
    setTimeout(() => {
      console.log("Adios", nombre)
      resolve()
    }, 1000)
  })
}

function conversacion(nombre, veces, callback) {
  if (veces > 0) {
    hablar(function () {
      conversacion(nombre, --veces, callback)
    })
  } else {
    adios(nombre, callback)
  }
}

async function main(nombre) {
  await hola(nombre)
  await hablar()
  await hablar()
  await hablar()
  await adios(nombre)
}

console.log("Empieza el proceso")
main("Leandro")
console.log("Termina el proceso")```

Async/Await nos ayuda a transformar los procesos de forma aparentemente sincronos. Para aplicarlo tenemos:

  1. Declarar una la funci贸n que queremos que su c贸digo sea sincrono como async.
async function nuestraFuncion(){
	// nuestro c贸digo ...
}
  1. Luego dentro del c贸digo debemos indicar las funciones que referenciamos con await, de esta forma el proceso espera que termine la funci贸n para seguir avanzando.
async function nuestraFuncion(){
	await nuestraFuncionAwait();
}

As铆ncrono.js


async function hola(nombre) {
    return new Promise(function (resolve, reject) {
        setTimeout(function() {
            console.log("Hola, " + nombre);
            resolve(nombre);
        }, 1500);
    });
}
async function hablar(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout(function() {
            console.log("bla, bla, bla, bla");
            resolve(nombre);
        }, 1000);
    });
}

async function adios(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout(function() {
            console.log("Adios", nombre);
            resolve();
        }, 1000);
    });
}

async function main() {
    let nombre = await hola('Cristobal');
    await hablar();
    await hablar();
    await adios(nombre)
    console.log('Terminamos el proceso...');
}

console.log('Empezamos el proceso...');
main();



He aqu铆 mi c贸digo

async function hola(n) {
    return new Promise( (resolve, reject) => {
        setTimeout( () => {
            log('Hola '+n)
            resolve(n);
        },1000) 
    })

}
async function hablar(n) {
    return new Promise( (resolve, reject) => {
        setTimeout(() => {
            log('BLA bla BLA');  
            resolve(n);  
        }, 1000);
    })
}

async function adios(n) { 
    return new Promise( (resolve, reject) => {
        setTimeout(() => {
            log('Hemos terminado de ejecutar el proceso mi compa ' + n);  
            resolve(n);  
        }, 1000);

    })
}
function log(str) {
    console.log(str);
}
async function main(){
    await hola('Carlos Enrique');
    await hablar();
    await hablar();
    await hablar();
    await adios('Carlos Enrique');
    log('TERMINO...');
}
log('Iniciamos el proceso')
main();
log('Terminamos el proceso en teoria');```
async function hola(nombre) {
    return new Promise(function (resolve, reject) {
        setTimeout(function () {
            console.log("Hola, " + nombre);
            resolve(nombre);
        }, 1500);
    });
    
}

async function adios(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout( function() {
            console.log("Adios",  nombre);
            resolve();
        }, 1000);
    });
    
}

async function hablar(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout(function() {
            console.log("Bla bla bla...");
            resolve(nombre);
            reject('Hay un error');
        }, 1000)
    });
    
}
async function main() {
   let nombre = await hola('Carlos');
    hablar();
    await adios(nombre);
}

console.log('Iniciando proceso');
main();
console.log('Terminando proceso');

He refactorizado el c贸digo, como muchos lo han comentado es inecesario retornar una promesa.

async function hola (name) {
  console.log(`Hola ${name}`)
}

async function adios (name) {
  console.log(`Adios ${name}`)
}

async function hablar () {
  console.log('Bla bla bla....')
}

async function main () {
  const nombre = 'Jos茅'
  await hola(nombre)
  await hablar()
  await hablar()
  await hablar()
  await adios()
}

console.log('Comienzo asincron铆a')
main()
  .catch(console.error)
console.log('No bloqueo el hilo principal')

Se ve muy bien en el codigo el uso de async/await, aunque lo que rompe lo 鈥渓indo鈥 es la obligatoriedad de usar un try catch para el manejo de errores en esos casos, colocando una nueva identacion y nuevas llaves. La verdad no se cual prefiero

Async/Await

Va a permitir definir una funcion de forma asincrona y esperar, de cualquier forma a nivel tecnico no va a bloquear el hilo principal ya que este estara espereando nuevas peticiones.

// Async Awaite 
//Declaracion de funciones 
//Funcion hola
async function hola(nombre){
    return new Promise(function(resolve, reject){
      setTimeout(function() {
        console.log('Hola ' + nombre);
        resolve(nombre);
        // En caso de que la funcion falle manda el reject 
        //reject('Algo no salio como lo pensaba')
    }, 1000);
    });
  }
  //Funcion hablar 
  async function hablar(nombre){
    return new Promise((resolve, reject) => {
      setTimeout(function(){
        console.log('Bla.. Bla.. Bla..');
        resolve(nombre);
      },1000);
    });
  }
  
  //Funcion adios 
  async function adios(nombre){
    return new Promise( (resolve, reject) => {
      setTimeout(function() {
        console.log('Adios ' + nombre);
        resolve();
      }, 1000);
    });
  }
  
  
  //  ---- 
  // Inicio de la funcion 
async function main(){
    let nombre = await hola('Robb ');
    await hablar();
    await hablar();
    await adios(nombre);
}

console.log('Emepezando el proceso');
main();
console.log('Termina el proceso, pero tiene que esperar a que terminen todo los otros procesos');
<h5>Resultado:</h5>
[nodemon] starting `node asyncAwait.js`
Emepezando el proceso
Termina el proceso, pero tiene que esperar a que terminen todo los otros procesos
Hola Robb 
Bla.. Bla.. Bla..
Bla.. Bla.. Bla..
Adios Robb 

Nota:
Esta notacion se utiliza para declarar variables en el ambito donde fue generara, es decir si esta el la funcion general su scope sera solo este, si esta en alguna funcion {} su scope sera solo este.

let nombre = 

Algo que me parece importante resaltar es que **siempre ** que se use async/await es una excelente pr谩ctica encerrar el await en un try/catch esto nos permitir谩 manejar errores y evitar sorpresas cuando algo salga mal.

const foo = async() => {
	try {
		await myPromise();
	} catch(err){
		console.log('Oops!')
	}
}

try...catch


(async () => {
  try {
   // Declaraciones a ejecutar
    await first()
    await second()
    await bad()
  } catch (error) {
    // Si ocurre alguna excepci贸n al ejecutar las declaraciones del bloque que estan en try
    console.log('Error', error)
  } finally {
   // Las declaraciones que se ejecuten en este bloque, se resolveran independientemente de lo que ocurra en try o en catch
    console.log('Se finalizo el proceso...')
  }
})()

Ejemplo

function first() {
  return new Promise((resolve, _) => {
    setTimeout(() => {
      console.log('first')
      resolve()
    }, 2000)
  })
}

function second() {
  return new Promise((resolve, _) => {
    setTimeout(() => {
      console.log('second')
      resolve()
    }, 2000)
  })
}

function bad() {
  return new Promise((_, reject) => {
    setTimeout(() => {
      console.log('bad')
      reject(new Error('auch!!! bad promise'))
    }, 2000)
  })
}

(async () => {
  try {
    await first()
    await second()
    await bad()
  } catch (error) {
    console.log('error', error)
  } finally {
    console.log('finalizo el proceso...')
  }
})()
async function hablar(nombre) {
    return new Promise((resolve, reject) => {
      setTimeout(function () {
        console.log("hablando blaa bla bla bla");
        resolve(nombre)
      }, 1000)
    });
  
  }
  
  
  async function hola(nombre) {
    return new Promise(function(resolve,reject){
      setTimeout(function(){
          console.log('hola, '+nombre);
          resolve(nombre);
      },1000);
  });
  }
  
  
  
 async function adios(nombre) {
    return new Promise((resolve,reject)=>{
          setTimeout(function () {
              console.log('adios',nombre);
              resolve(nombre);
          },1000);
      });
  }
  


  async function main(){
      nombre=await hola('david');
      await hablar();
      await hablar();
      await hablar();
      await hablar();
      await adios(nombre);
  }
  
  • La sintaxis async await nos va ha permitir definir una funci贸n as铆ncrona y permitir que esta termine. Async await se basa en promesas.
function myfunction(){
	return New Promise( (resolve, reject) => {
		鈥ode
		If(code === true){
			resolve(correctValue);
		}else {
			Reject(wrongValue);
		}
	});
}
async function Mymainfuction(){
	await myfunction();
}

Si queremos evitar que nuestro codigo se siga viendo asincrono, como podriamos evitar que todo lo asincrono se vea asi, a veces que queremos que se vaya ejecutando de forma continua ya que hay funciones que requieren una de otra y por eso se requieren ejecutar de forma ordenada.

Para todo esto se creo la funcion de Async await que nos va a permitir definir una funcion de forma explicita de forma asincrona y asi esperar que esta funcion termine.

Para hacer que nuestras funciones sean asincronas solo tenemos que agregar el prefico async

async function hola(){};
const adios = async (nombre) => {}

Para poder ejecutar nuestro codigo necesitariamos crear una funcion asincrona donde dentro utilicemos AWAIT para poder ejecutar cada fucncion.

const hola = async (nombre) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log(`Hola ${nombre}`);
      resolve(nombre);
    }, 1500);
  });
};
const main = async () => {
  await hola("Joel");
};

main();

Esto es tan potente que essto solo convierte las promesas en procesos aparentemente sincronos, gracias a esto podemos hacer que todo se espere y nuestroa funcion asincrona sea lo mas cercana a sincrona.

async function main () {
let nombre = 鈥楰aito-Kun鈥;
await hola(nombre);
// sin el await no espera que se cumpla la funcion hablar y ejecuta proceso terminado!
hablar();
await hablar();
await hablar();
await hablar();
await adios(nombre);
}

function hola(nombre) {
    return new Promise(function (resolve, reject) {
        setTimeout(function () {
            console.log(`Hola, ${nombre}`);
            resolve(nombre);
        }, 1500)
    });
    
}

async function hablar(nombre) {
    return new Promise((resolve, reject) => {
        setTimeout(function() {
            console.log('Bla bla lba bla... ');
            resolve(nombre);
            reject('Hay un error');
        }, 1000);
    });
}

async function adios(nombre) {
    return new Promise( (resolve, reject) => {
        setTimeout(function() {
            console.log(`Adios ${nombre}`);
            resolve(nombre);
        }, 1000);
    });
}

async function main() {
    let nombre = await hola('Johan');
    await hablar();
    await hablar();
    await hablar();
    await adios(nombre);
    console.log('Termina el proceso');
};
console.log('Empezamos el proceso');
main();

Async / Await

async function hello(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log(`Hola ${name}`)
      resolve(name)
    }, 1000)
  })
}

async function speak(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log('blah blah blah...')
      resolve()
    })
  })
}

async function bye(name, otroCallback) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log(`Adios ${name}`)
      resolve()
    }, 1000)
  })
}

async function main() {
  let name = await hello('Santiago')
  await speak()
  await speak()
  await speak()
  await bye(name)
  console.log('Termina el proceso...')
}

console.log('Empezamos el proceso...')
main()

Async await me permite tener una sintaxis m谩s intuitiva y puedo saber como van a ser ejecutadas mis funciones s铆ncronas y as铆ncronas.

Creo que ya me esta quedando claro鈥 馃槃

Me gusta que en muchos cursos se retoma el mismo tema (curso pr谩ctico, b谩sico y profesional de js, etc), pues as铆 se afianzan los conocimientos. As铆 te das cuenta que todo est谩 conectado y que muchas veces influye m谩s que entiendas un tema para que lo ejecutes que aprenderlo todo de memoria.
Gracias Platzi! Gran profe btw

Este profe es genial , nos dice 鈥溾mpezamos con los m贸dulos鈥 隆Con una emoci贸n! 馃榿 En verdad motiva mucho.

async/await, convertir las promesas en procesos aparentemente sincronos que tiene funciones as铆ncronas.Bye .then

azucar sint谩ctico 馃槀

Gracias por esta clase, estuvo excelente, acabe de entender lo que no entendia en cursos anteriores.

Aqui les dejo muy buena documentaci贸n sobre el tema por si quieren profundizar un poco.
https://developer.mozilla.org/es/docs/Web/JavaScript/Referencia/Sentencias/funcion_asincrona

Comparto este link que complementa bien estas clases de asincron铆a:

https://medium.com/@jmz12/callbacks-promesas-y-async-await-que-alguien-me-explique-514137cb57e2

Tambi茅n les recomiendo el curso de asincronismo con javascript excelente curso con el profesor Oscar Barajas
https://platzi.com/clases/asincronismo-js/

Tremenda Clase

async function hello(userName) {
    return new Promise( (resolve, reject) => {
        setTimeout(function () {
            console.log('Hello', userName)
            resolve(userName);
        }, 1000);
    });
};

async function speak(userName) {
    return new Promise ( (resolve, reject) => {
        setTimeout ( function () {
            console.log('I am speaking something, blah blah blah');
            resolve(userName);
        }, 1000);
    });
};

async function bye(userName) {
    return new Promise((resolve, reject) => {
        setTimeout( function () {
            console.log('Bye', userName);
            resolve(userName);
        }, 1000);
    });
};

async function main() {
    let userName = await hello('Carlos');
    await speak();
    await speak();
    await speak();
    await speak();
    await speak();
    await bye(userName);
    console.log('Process finished')

}
console.log('Process started')
main();
let algo = async ()=>{
    console.log('Primero')
    await ((async ()=>{return new Promise ((resolve, reject)=>{setTimeout(()=>{console.log('Segundo');resolve()} ,1000)}) })()) //xd
    console.log('Tercero')
}

algo()
const hello = (name) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(`Hello ${name}`)
            resolve(name)
        }, 1000)
    })
}

const speak = () => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(`Bla bla bla`)
            resolve()
        }, 1000)
    })
}

const goodbye = (name) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(`Goodbye ${name}`)
            resolve(name)
        }, 1000)
    })
}

const main = async () => {
    let name = await hello('jsdnlb')
    await speak()
    await speak()
    await goodbye(name)
    console.log('App completed')
}

// Execution
console.log('Start App')
main()
console.log('Other process executed immediately after starting')

(async (name) => {
  console.log('Iniciando el proceso..')
  await hola(name)
  await hablar(name)
  await adios(name)
  console.log('Termina el proceso..')
})('Async/Await')

Me gusta la estrategia del prof Carlos de ense帽ar las 3 herramientas para manejar asincronismo a partir del mismo ejemplo; as铆 se puede distinguir las diferencias y semejanzas entre ellas. Tambi茅n me gusta cuando el prof dice que todo es Muy, muy, muy sencillo鈥 deja una sensaci贸n de control y dominio que contagia.

Async / Await

Escrib铆 este c贸digo y me gust贸 mucho porque simula muy bien un proceso as铆ncrono. Puedes copiarlo y correrlo para que observes el comportamiento de las promesas, us茅 un n煤mero random para que fuera din谩mico.

function promesa() {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            const randomNumber = Math.floor(Math.random() * 2) + 1;
            randomNumber === 1 ? resolve('success'): reject('failure');
        },2000);
    });
}

async function main () {
    try {
        const resultado = await promesa();
        console.log(resultado);
    } catch (err) {
        console.log(err);
    }
}

setInterval(main, 3000);

Una mejora a todo esto (callbacks, promesas), es usar async await. Consiste en crear una funci贸n declarada como as铆ncrona y dentro de esta, invocar las funciones as铆ncronas una de tras de la otra, para que la segunda espere a que la primera se ejecute y termine, y as铆 sucesivamente. El async await funciona en conjunto con las promesas.

function hola(nombre) {
    return new Promise(function (resolve, reject) {
        setTimeout(function () {
            console.log('Hola, '+ nombre);
            resolve(nombre);
        }, 1000);
    });
}

function hablar(nombre) {
    return new Promise( (resolve, reject) => {
        setTimeout(function() {
            console.log('Bla bla bla bla...');
            resolve(nombre);
            //reject('Hay un error');
        }, 1000);
    });
}

function adios(nombre) {
    return new Promise( (resolve, reject) => {
        setTimeout(function() {
            console.log('Adios', nombre);
            resolve();
        }, 1000);
    });
}

async function main(nombre) 
{
   console.log('Iniciando proceso..'); 
   await hola(nombre); 
   await hablar(nombre);
   await hablar(nombre);
   await hablar(nombre);
   await hablar(nombre);
   await adios(nombre);
   console.log('Terminando proceso');
}
    
main("Willie");

Async y Await detienen el proceso y esperan a que se resuelva la promesa pero hay que tener en cuenta que detienen el proceso dentro de la funci贸n donde son invocados, todo lo que ocurre fuera de dicha funci贸n sigue siendo asincrono y no espera a que se termine de resolver la promesa.

Realmente y para que quede m谩s claro, una funci贸n se marca como async cuando internamente llama a otra funci贸n asincrona, esto para que el c贸digo que haga llamado dicha funci贸n marcada como async sepa que hay algo asincrono ejecutandose, algo que puede esperar o que a煤n seguir谩 en el event loop cuando se termine el llamado de la funci贸n marcada.

馃暥 Codigo

async function hola(nombre) {
  return new Promise(function (resolve, reject) {
    setTimeout(function () {
      console.log("Hola, " + nombre);
      resolve(nombre);
    }, 1000);
  });
}

async function hablar(nombre) {
  return new Promise((resolve, reject) => {
    setTimeout(function () {
      console.log("Bla bla bla bla...");
      resolve(nombre);
    }, 1000);
  });
}

async function adios(nombre) {
  return new Promise((resolve, reject) => {
    setTimeout(function () {
      console.log("Adios ", nombre);
      resolve(nombre);
    }, 1000);
  });
}
async function main(){
    let nombre = await hola('Carlos');
    await hablar();
    hablar();
    hablar();
    await adios(nombre);
console.log('Termina el proceso...');

}
console.log('Empezamos el proceso...');
main();
console.log('Va a ser la segunda instruccion que se ejecute');

ojala todos los profes de platzi tuvieran una metodolog铆a como la de este profe, se le entiende hasta lo que no dice. que heavy!

/*
EL OBJETIVO DE ESTA PR脕CTICA ES EMULAR TODO LO APRENDIDO HASTA EL MOMENTO CON NODE JS Y ASINCRONISMO
TODO: C贸digo b谩sico para emular la obtenci贸n, lectura, escritura y registro de informaci贸n
* Se debe tener en cuenta que este de funcionamiento es del tipo as铆ncrono, pero que se debe ejecutar de manera 鈥渟ecuencial鈥 para que todo este proceso se ejecute de manera correcta
*/

// OBTENIENDO EL REGISTRO
let dbFiles = [
{
nombre: 鈥淏remdow鈥,
direccion: 鈥淒esconocido鈥,
edad: new Date().getFullYear() - 1996
},
{
nombre: 鈥淣ancy鈥,
direccion: 鈥淧aradero Aeropuerto鈥,
edad: new Date().getFullYear() - 1972
},
{
nombre: 鈥淵enifer鈥,
direccion: 鈥淎vp. Wimpillay鈥,
edad: new Date().getFullYear() - 1995
}
]

function obtenerRegistro(id){

return new Promise( (resolve, reject) => {
    setTimeout( () => {
        console.log("1. Obteniendo el registro ...")
        resolve(id)
    }, 1000)
})

}

function lecturaRegistro(id){
return new Promise( (resolve, reject) => {
console.log(鈥2. Desencriptando los datos 鈥︹)
setTimeout(()=>{
let personalData = Nombre: ${dbFiles[id].nombre} Direcci贸n: ${dbFiles[id].direccion} Edad: ${dbFiles[id].edad}
console.log(personalData)
resolve(id)

    }, 3000)
})

}

function escrituraRegistro(id){
return new Promise( (resolve, reject) => {
setTimeout( () => {
console.log(3. Usuario ${dbFiles[id].nombre} los registros se modificaron correctamente)
resolve(id)
}, 500)
})
}

function guardarRegistro(id){
return new Promise( (resolve, reject) => {
setTimeout( () => {
console.log(4. Registros guardados para ${dbFiles[id].nombre})
console.log(鈥5. Finalizando la conexi贸n鈥)
}, 1000)
})
}

// LO QUE NORMALMENTE PASABA EN UNA FUNCI脫N ASINCRONA

// saludar(鈥渘ombre鈥, () =>{
// c贸digo para el callback
// console.log(nombre)
// })

// EJECUTANDO EL ASINCRONISMO MEDIANTE PROMESAS
console.log(鈥淪tart Process鈥)
// [parametros] [then() para llamar al callback]
/*
En then definimos el callback a ejecutar
*/
// El parametro es accessible desde todos los then()

// FILE
obtenerRegistro(1)
.then( (id)=>{
return lecturaRegistro(id)
})
.then( (id) => {
return escrituraRegistro(id)
})
.then( (id) => {
guardarRegistro(id)
console.log(鈥淓nd Process鈥)
})

// FILE 1
async function main(){
let idFile = await obtenerRegistro(0)
await lecturaRegistro(idFile)
await escrituraRegistro(idFile)
await guardarRegistro(idFile)
console.log(鈥淓nd Process鈥)
}

main()

Async / await

En ES2017 se introducen las palabras clave async/await, que no son m谩s que una forma de az煤car sint谩ctico para gestionar las promesas de una forma m谩s sencilla. Con async/await seguimos utilizando promesas, pero abandonamos el modelo de encadenamiento de .then() para utilizar uno en el que trabajamos de forma m谩s tradicional.

La palabra clave async
En primer lugar, tenemos la palabra clave async. Esta palabra clave se colocar谩 previamente a function, para definirla as铆 como una funci贸n as铆ncrona, el resto de la funci贸n no cambia:

funcion_asincrona = async () => {
  return 42;
}

Al ejecutar la funci贸n veremos que ya nos devuelve una Promise que ha sido cumplida, con el valor devuelto en la funci贸n (en este caso, 42). De hecho, podr铆amos utilizar un .then() para manejar la promesa:

funcion_asincrona().then(value => {
  console.log("El resultado devuelto es: ", value);
});

Sin embargo, veremos que lo que se suele hacer junto a async es utilizar la palabra clave await, que es donde reside lo interesante de utilizar este enfoque.

La palabra clave await
Cualquier funci贸n definida con async, o lo que es lo mismo, cualquier Promise puede utilizarse junto a la palabra clave await para manejarla. Lo que hace await es esperar a que se resuelva la promesa, mientras permite continuar ejecutando otras tareas que puedan realizarse:

funcion_asincrona = async () => {
  return 42;
}

const value = funcion_asincrona();             // Promise { <fulfilled>: 42 }
const asyncValue = await funcion_asincrona();  // 42

Observa que en el caso de value, que se ejecuta sin await, lo que obtenemos es el valor devuelto por la funci贸n, pero 芦envuelto禄 en una promesa que deber谩 utilizarse con .then() para manejarse. Sin embargo, en asyncValue estamos obteniendo un tipo de dato , guardando el valor directamente ya procesado, ya que await espera a que se resuelva la promesa de forma as铆ncrona y guarda el valor.

Esto hace que la forma de trabajar con async/await, aunque se sigue trabajando exactamente igual con promesas, sea mucho m谩s f谩cil y trivial para usuarios que no est茅n acostumbrados a las promesas y a la asincron铆a en general, ya que el c贸digo 芦parece禄 s铆ncrono.

Async/Await: Nos permite ejecutar en orden las promesas. Aunque tambi茅n depende en como estemos declarando nuestro c贸digo. Ej.

async function item(){
  setTimeout(() => {
    console.log('Finalizado');	
  }, 1000)
 }
 async function main(){
   console.log(3);
   await item();
 }

 console.log(1) 
 main();
 console.log(2)

 /*
 1
 3
 2
 Finalizado
Esto es porque console es sincrono, al pasar por main detecta que es asincrono, y como la primera declaracion es sincrono lo imprime. La segunda declaracion dentro de await hace que lo mande en event queue, saltando al console.log(2).  y posteriormente se ejecuta el item.
 */

En cambio si cambiamos el orden en main, declaramos primero el await, automaticamente pasara a event queue.

async function item(){
  setTimeout(() => {
    console.log('Finalizado');	
  }, 1000)
 }
 async function main(){
   await item();
   console.log(3);
 }
 console.log(1) 
 main();
 console.log(2)

/*
 1
 2
 3
 Finalizado
 */

It鈥檚 cool !

Alguien me explica la necesidad de colocar async en las funciones hola, hablar y adios? Seg煤n yo no es necesario

Les dejo mi c贸digo con el que esta debbugeando y experimentando por si quieren revisar y comentar鈥 son las 2am as铆 que s茅 que tan coherente sea XD

	//----------------------------------ejemplo de asincronia
	//implementacion
	console.log('inicio proceso')
	let contadorPrint = 0 //REQUIERE QUE SEA SUPER GLOBAL //ni siquiera dentro de una fn-anonima junto a main()   ()()
	main('Alvaro')
  	.catch (error=> {
	    	console.log('Ocurrio un error')
	    	console.error(error)
	  })
	console.log('finalizo proceso sincrono')
	
	//definicion de fn
	async function main(name){
		// let contadorPrint = 0 //ac谩 no funciono! ERROR no definido al usarse en fnPrint()
		let data = await fndb(name)
		data = await fnPrint(data)
		data = await fnPrint(data)
		fnPrint(data) //OJO: dado q la data no cambio, se puede trabajar as铆
						//OJO: genera un resultado "sincrono", sin espera ////antes: data = await fnPrint(data)
		fnPrint(data) //OJO: dado qu la data no cambio, se puede trabajar as铆
						//OJO: genera un resultado "sincrono", sin espera ////antes:  data = await fnPrint(data)
		fnCierre(data[1]) //OJO: dado q la data no cambio, se puede trabajar as铆
							//OJO: genera un resultado "sincrono", sin espera
	}
	async function fndb(nombre){  //solo en esta!, sustituyendo Promise(function(resolve,reject){}) por async
			if(nombre==undefined)throw new Error("ingrese un nombre valido")
			console.log(`in-fndb_ ${nombre} realiz贸 una peticion`)
			const waitFor = delay => new Promise(resolve => setTimeout(resolve(['_HeySoyLaData_',nombre]), delay));
				//RECORDAR que setTimeout NO retorna una promesa!!!
			var data = await waitFor(1000)	
			return data
			console.log('out-fndb_') //////esta linea no se va a ejecutar!!!!! /// a diferencia de las propesas
	}
	function fnPrint(data, callback){ //dado q recibe una promesa ya resuelta, no va a requerir await, y por tanto tampoco el async
		return new Promise(function(resolve,reject){
			contadorPrint++
			// let denegar = 4   
			// if(contadorPrint>=denegar) reject(`error imprimir en ${contadorPrint}`)
			// else{
				console.log(data[0],'.(fnPrint) #',contadorPrint)
				setTimeout(()=>{
					//console.log('Ya impreso genero otra logica, ej cierra proceso.(fnPrint)')
					resolve(data)
				},1000)
			// }
			console.log('out-fnPrint_')		
		})
	}
	function fnCierre(name){
			console.log(name,', ya finalizo proceso asincrono, gracias.(fnCierre)')
	}

	/*
		SECUENCIA:
			inicio proceso
			VM2838:in-fndb_ Alvaro realiz贸 una peticcion
			// *** en async-aawait no se va imprimir:  VM2838:out-fndb_  ***se retorna antes
			VM2838:finalizo proceso sincrono
			VM2838:recibo data.(fndb)
			VM2838:_HeySoyLaData_ .(fnPrint) # 1
			VM2838:out-fnPrint_
			VM2838:_HeySoyLaData_ .(fnPrint) # 2
			VM2838:out-fnPrint_
			VM2838:_HeySoyLaData_ .(fnPrint) # 3
			VM2838:out-fnPrint_
			VM2838:_HeySoyLaData_ .(fnPrint) # 4
			VM2838:out-fnPrint_
			VM2838:Alvaro , ya finalizo proceso asincrono, gracias.(fnCierre)
	*/

Dado este codigo




Si comento la linea 18 y 20 (del valor del await) corre prime los ultimos console.logs de la funcion main antes de resolver la promesa

Este ejemplo de async/await podria ser mejor tomar un ejemplo de abrir archivo, cambiar nombre del archivo, leer y cerrar archivo.

Considereo que es buen maestro hasta ahora, pero estaria genial que lo que explica al principio se apoyara con alguna diapositiva o algo visual !!!

Para evitar que lo as铆ncrono, se vea de dicha forma, se utiliza la sintaxis Async/away, permitiendo definir una funci贸n de forma expl铆cita como funci贸n as铆ncrona y poder esperar a que esa funci贸n termine.
Si se tienen funciones que son promesas, solo se le debe a帽adir un async delante de dicha funci贸n, lo que convertir谩 la funci贸n X en una funci贸n as铆ncrona declarada y que se puede empezar a usar con el await.
Los await deben ir dentro de una funci贸n la cual debe ser llamada para que el programa funcione correctamente.

await puede convertir procesos as铆ncronos a procesos aparentemente s铆ncronos, pero la funci贸n es as铆ncrona

Hay que acotar que si la promesa cae en el then usando el await todo ira bien y seguira a la siguiente linea, pero si la promesa termina en un catch va la lanzar excepcion. Es por eso que en muchos caso el await va acompa帽ado de un try/catch. como en el siguiente ejemplo:

try{
// Equivalie al .then
var result = await myPromise();
} catch(error) {
	// Equivale al .catch
	console.log('Error: ', error);

}

muy buena. vamos que vamos

Excelente! Me qued贸 super claro.

Al fin pude entender todo lo de asincron铆a con este profesor.

Utilizar la palabra clave async en una funci贸n, autom谩ticamente hace que esa funci贸n retorne una promesa. Por lo que es posible usar el m茅todo .then para una funci贸n async que mandar谩 como par谩metro lo que 鈥渞etorne鈥.

const asincrona = async () => {

  await Promise.resolve()

  return true
}

asincrona()
  .then(console.log) // true

Cuando el profesor hizo as铆ncronas las funciones que ya regresaban una Promesa, solo las hizo redundantes porque de una forma u otra iban a regresar una Promesa.

async function hola(nombre){
    await (
        setTimeout(function() {
            console.log(`Hola ${nombre}`);
        },1000)
    )
}
async function hablar(){  
    await (
        setTimeout(function() {
            console.log('Bla bla bla...');
        },1500)
    );
}
async function adios(nombre){
    await (
        setTimeout(function() {
            console.log(`Adios ${nombre}`);
        },2000)
    );
}

hola('facu');
hablar();
hablar();
adios('facu');

Como dato curioso, podemos convertir setTimeout en una funci贸n mas elegante con async / await

const sleep = (ms) => {
  return new Promise(resolve => setTimeout(resolve, ms));
}

const miFuncion = async () => {
	await sleep(2000); //Esto funciona igual que setTimeout
	console.log('hola mundo')
}

miFuncion()

Al fin estoy empezando a entender !!!

Vamos comprendiendo mucho mucho m谩s 馃槂

Una de las ventajas es el tema de ir enviado datos entre funciones.
Con .then se tenia que enviar a cada hablar() incluso si no utilizaba, para que adi贸s la utilice.
Ahora, solo recuperamos el valor del resolve y lo podemos utilizar donde queramos.