zomievey / asyncdrills Goto Github PK

Asynchronous Code Drills The purpose of this lab is to practice Asynchronous JavaScript concepts discussed in the video lectures. You'll want to feel comfortable writing your own functions that return new Promise objects, write setTimeout functions, and using .then()/.catch().

Steps Setup Make sure all the html has loaded before using JavaScript Create a new project folder and connect it to a github repository. Copy this README.md file into it. Create an index.html file and an app.js file and link the two together. Timing Out Create a function that takes a string message as an argument, and logs that message to the console Now call your function with a message Use setTimeout to call your function again, but with a different message and after 2 seconds Hint: If you both of your messages log at the same time, look at the syntax of a setTimeout. You'll need to call your function within an anonymous function the timeOut executes. Create a new function called getWords that will attempt to do the following using several setTimeout calls: Log a word instantly After 3 seconds, log another word 2 seconds after that, log a third word Finally 1 second after the third word, log a final word Callbacks and Recursion Create a function called done that logs Job's done! to the console Create a different function (on the global scope) called countdown that accepts two arguments, num and callback The goal of this function will be to log a "countdown" from the number passed in as an argument, delayed by 1 second each time, and when it gets to 1, it should execute the callback argument Hint: You'll need one setTimeout for this to work, an if/else statement, and NO for loop for this to work Super Hint: You'll need to call countdown within itself, a concept called recursion Mega Hint: There's a YouTube vid showing the concept off Call the countdown function and pass it two arguments: a number of seconds to countdown from and the done function and see if it works Promises Promises ;) Create a new global variable called lunchTime with a value of true Create a new function called orderMeSomeFood that returns a new Promise Hint: If you're unsure of the correct syntax, check out this CodePen In the resolver function of the Promise, write logic to check if the lunchTime variable is true If lunchTime is true, create an object with two properties and values (key/value pairs) of your choice: lunch: "your favorite lunch" drink: "your favorite beverage" Resolve the Promise with your object If lunchTime is false, create a variable and set it equal to a new Error that has your own message Hint: Check out this page on how to use a new Error Reject the Promise with your new Error Call your orderMeSomeFood function, chain you .then and don't forget your .catch If the promise within the function resolves, it should then log the object it resolved with Swap lunchTime to false, and then the promise should reject with your custom created error and be logged from you .catch Toggle lunchTime and check out the results of your newly created Promise function.