Having "fun" with YavaScripts

yavaScripts-00.js

// Classic completionHandler callback scenario

// Creating the timerFunction()

const timerFunction = function(completionHandler) {
  console.log('Setting first timeout of 1 second');

  setTimeout(function() {
    console.log('Setting second timeout of 2 seconds');

    setTimeout(function() {
      console.log('Setting third timeout of 3 seconds');

      setTimeout(function() {
        console.log('We have completed all the timers');

        completionHandler();
      }, 3000);
    }, 2000);
  }, 1000);
};

// Using the timerFunction()

timerFunction(function() {
  console.log('We have completed everything');
});

/*

Output:

Setting first timeout of 1 second
Setting second timeout of 2 seconds
Setting third timeout of 3 seconds
We have completed all the timers
We have completed everything

*/

// Now using promises

// setTimeout wrapper that returns a promise

const timerWrapper = function(time) {
  return new Promise(function(resolve) {
    setTimeout(resolve, time);
  });
};

// Creating the anotherTimerFunction()

const anotherTimerFunction = function(completionHandler) {
  console.log('Promise setting of the first timeout of 1 second');

  timerWrapper(1000)
    .then(function() {
      console.log('Promise setting second timeout of 2 seconds');

      return timerWrapper(2000);
    })
    .then(function() {
      console.log('Promise setting second timeout of 3 seconds');

      return timerWrapper(3000);
    })
    .then(function() {
      console.log('We have completed all the promise timers... again');

      completionHandler();
    });
};

// Using the anotherTimerFunction()

anotherTimerFunction(function() {
  console.log('We have completed everything using promises');
});

/*

Output:

Promise setting of the first timeout of 1 second
Promise setting second timeout of 2 seconds
Promise setting second timeout of 3 seconds
We have completed all the promise timers
We have completed everything using promises

*/

// Now using async/await

// Creating the yetAnotherTimerFunction()

const yetAnotherTimerFunction = async function() {
  console.log('Async setting of the first timeout of 1 second');

  const timer1 = await timerWrapper(1000);

  console.log('Async setting of the first timeout of 2 second');

  const timer2 = await timerWrapper(2000);

  console.log('Async setting of the first timeout of 3 second');

  const timer3 = await timerWrapper(3000);
  
  console.log('We have completed all the async timers');
};

// Consuming the yetAnotherTimerFunction() with async/await pattern

const callYetAnotherTimerFunction = async function() {
  await yetAnotherTimerFUnction();
  
  console.log('We have completed everything with async/await');
}

// Using the callYetAnotherTimerFunction()

callYetAnotherTimerFunction();

/*

Output:

Async setting of the first timeout of 2 second
Async setting of the first timeout of 3 second
We have completed all the async timers
We have completed everything using async/await

*/

This looks good. A few points:

1. There are a few lines I would expect a semicolon if that is the standard the team works on, but in this situation they're not syntactically required. End of lines 21, 47, 49, 54, 60, 65, 70, 71, 72, 77, 78, 96-110, 116, 117. All stylistic preferences, but at the end of a statement.
2. let and const keywords are somewhat interchangeable (code won't break) but semantically let is for declaring variables that will be reassigned, const is for constants. lines 99, 103, 107 should be declared with const when used like this.

One note on yetAnotherTimerFunction call, if you wanted to only use async/await it could be called like this...

const callYetAnother = async function() {
  await yetAnotherTimerFunction();
  console.log('We have completed everything using aync/await');
};

callYetAnother();

The callYetAnother function awaits the resolution of the yetAnotherTimerFunction even though it's resolved/rejected value isn't assigned to anything. Another note: this did require another wrapping async function to get the last log.

Hope this helps!! I appreciate the time you're putting in to get on the same page. I'm excited to see that from the whole team.

Thanks! I made the changes. BTW, I think I vaguely read something about let and const having different scoping rules. Is this true? If so, can you elaborate?