Synchronous vs. Asynchronous
Most code is synchronous code, which means it runs in sequence. Each line of code executes in order, one after the next.
Example of synchronous code:
console.log("I print first");
console.log("I print second");
console.log("I print third");
Asynchronous or async code runs concurrently. While the main thread continues running subsequent code, async tasks are handled outside the main execution flow and run as system resources allow. A good example is with the built-in setTimeout() function.
setTimeout accepts a function and a number of milliseconds as inputs. It sets aside the function to be run after the number of milliseconds has passed, at which point it gets queued for execution when the main thread is available:
console.log("I print first");
setTimeout(
() => console.log("I print third because I'm waiting 100 milliseconds"),
100,
);
console.log("I print second");
// Output:
// I print first
// I print second
// I print third because I'm waiting 100 milliseconds
Assignment
To help us visualize how asynchronous code executes, let's practice with an example from Textio. Keep in mind that you probably wouldn't normally use setTimeout to change the order in which text is printed to the console, but it's a good way for us to practice async code.
Update the waiting durations so that text is printed in the following order:
- Starting Textio service initialization...
- Connecting to SMS providers...
- Configuring message routing...
- Setting up error handling and retries...
- Textio setup complete!
The time to set up a project is 2 seconds, so make sure none of the wait times are greater than 2000 ms.