'async/await' en JavaScript: desglose fácil

Tuve dificultades para aprender el concepto async & await en JavaScript, por eso quiero explicarlo aquí de la manera más simple posible para que no le resulte difícil en absoluto:

Para las funciones asíncronas, supongo que ya conoce Promises en JS. Si no es así, lea sobre Promises en JavaScript aquí:

https://amitabhiam.medium.com/i-promise-this-way-promise-won-t-break-your-heart-in-javascript-promises-727747b8a6ec

funciones asíncronas :

Una función se puede hacer asíncrona usando la palabra clave 'async'. Puede contener cero o más expresiones 'await'.

Funciona con Promise para evitar múltiples situaciones .then() en la cadena de promesas o para escribir un comportamiento basado en promesas con un estilo claro.

Declaración: se puede declarar usando 'función asíncrona' donde se permite la palabra clave 'aguardar' dentro del cuerpo de la función.

La expresión de espera suspende la ejecución hasta que se cumpla o rechace la promesa de devolución, lo que hace que la función de promesa se comporte de forma sincrónica.

await solo es válido dentro de la función asíncrona.

Ejemplo usando Promise:

function resolveAfter6Second() {
    console.log("starting a slow promise");
    return new Promise ((resolve) => {
        setTimeout( function () {
            resolve("slow");
            console.log("This is slow promise");
        }, 6000);
    } );
}

function resolveAfter3Second() {
    console.log("starting fast promise");
    return new Promise((resolve) => {
      setTimeout(() => {
        resolve("fast");
        console.log("fast promise is done");
      }, 3000);
    });
  }


async function sequentialStart() {
    console.log("performing Sync Operation");

    const slow = await resolveAfter6Second();
    console.log(slow);

    const fast = await resolveAfter3Second();
    console.log(fast);
}

sequentialStart();