La rutina matutina para explicar Async/Await

Mi rutina

Rutina matutina

Drink water 🥛

Rutina matutina

Drink water 🥛
Take a shower 🚿

Rutina matutina

Drink water 🥛
Take a shower 🚿
Get dressed 👖

Rutina matutina

Drink water 🥛
Take a shower 🚿
Get dressed 👖
Drink juice 🍊🍍

Rutina matutina

Drink water 🥛
Take a shower 🚿
Get dressed 👖
Drink juice 🍊🍍
Trenzar my hair

Rutina matutina

Drink water 🥛
Take a shower 🚿
Get dressed 👖
Drink juice 🍊🍍
Trenzar my hair
Drink coffee ☕️

A iniciar el trabajo remoto

1. Each one in a row

2. Completing all ASAP no matter the order

👖 before 🚿?

Create an "Async" function

* StartTime (parameter if we are late for work or not)

const morningRoutine = async (startTime) => {

};

Create an "Async" function

const drinkWater = (time) => new Promise(resolve, reject) => {
  resolve (time);
}

const morningRoutine = async (startTime) => {
  const step1FinishTime = await drinkWater(startTime)
};

Create an "Async" function

const drinkWater = (time) => new Promise(resolve, reject) => {
  resolve (time);
}

const shower = (time) => new Promise(resolve, reject) => {
  resolve (time);
}

const morningRoutine = async (startTime) => {
  const step1FinishTime = await drinkWater(startTime)
  const step2FinishTime = await shower(step1FinishTime)
};

Create an "Async" function

* startTime (parameter if we are late for work or not)

const morningRoutine = async(startTime) => {
   
  Promise 1 resolves
🕢<------------------------🥛
  |
  |____pass_val
           |_to_promise 2___
                            |  
  Promise 2 resolves        |    
🕢<------------------------🚿

}

Logic

const drinkWater = (time) => new Promise(resolve, reject) => {
  resolve (time);
}

const shower = (time) => new Promise(resolve, reject) => {
  resolve (time);
}

const morningRoutine = async (startTime) => {
  const step1FinishTime = await drinkWater(startTime)
  const step2FinishTime = await shower(step1FinishTime)
  const step3FinishTime = await getDressed(step2FinishTime)
  const step4FinishTime = await drinkJuice(step3FinishTime)
  const step5FinishTime = await trenzarPelo(step4FinishTime)
  const step6FinishTime = await drinkCoffee(step5FinishTime)
  return step6FinishTime;
};

Create an "Async" function

Handling errors

const drinkWater = (time) => new Promise(resolve, reject) => {
  resolve (time);
}

const shower = (time) => new Promise(resolve, reject) => {
  resolve (time);
}

const morningRoutine = async (startTime) => {
try{
  const step1FinishTime = await drinkWater(startTime)
  const step2FinishTime = await shower(step1FinishTime)
  const step3FinishTime = await getDressed(step2FinishTime)
  const step4FinishTime = await drinkJuice(step3FinishTime)
  const step5FinishTime = await trenzarPelo(step4FinishTime)
  const step6FinishTime = await drinkCoffee(step5FinishTime)
  return step6FinishTime;
}
catch (e) {
  return e;
}
};

Using “Try” and “Catch” In the Async Function

const morningRoutine = async(startTime) => {
  try{
    1🕢<------------------------🥛
      |_________________________
                                |    
    2🕢<------------------------🚿
      |_________________________
                                |    
    3🕢<------------------------👖
      |_________________________
                                |    
    4🕢<------------------------🍍🍊
      |_________________________
                                |    
    5🕢<------------------------🚿
      |_________________________
                                |    
    6🕢<------------------------☕️    
  }
  catch (e) {
    return e;
  }

}

Logic

const morningRoutine = async(startTime) => {
  try{
    1🕢<------------------------🥛
      |_________________________
                                |    
    2🕢<------------------------🚿
      |_________________________
                                |    
    3🕢<------------------------👖
      |_________________________
                                |    
    4🕢<------------------------🍍🍊
      |_________________________
                                |    
    5🕢<------------------------🚿
      |_________________________
                                |    
    6🕢<------------------------☕️    
  }
  catch (e) {
    return e;
  }

}

Logic

Demo

Gracias

@luucamay_