JS篇--async练习篇

这篇主要为闭包练习题及答案合集
题目来源：https://github.com/CodesmithLLC/cs-bin-solutions/blob/master/async.js

Challenge 1

Thinking point (no writing code necessary for this challenge): Inspect the code given to you in Challenge 1. In what order should the console logs come out? Howdy first or Partnah first?

function sayHowdy() {
  console.log('Howdy');
}

function testMe() {
  setTimeout(sayHowdy, 0);
  console.log('Partnah');
}
// After thinking it through, uncomment the following line to check your guess!
 testMe(); // what order should these log out? Howdy or Partnah first?

Answer:

// 'Partnah' will log out first.

Challenge 2

Create a function delayedGreet that console logs welcome after 3 seconds.

function delayedGreet() {
  // ADD CODE HERE
}

Answer:

function delayedGreet() {
  console.log("hello");  
}

function testMe(){
  setTimeout(delayedGreet,3000);
}
testMe();

Challenge 3

Create a function helloGoodbye that console logs hello right away, and goodbye after 2 seconds.
Question:

/* CHALLENGE 3 */

function helloGoodbye() {
  // ADD CODE HERE
}
// Uncomment the following line to check your work!
// helloGoodbye(); // should log: hello // should also log (after 3 seconds): good bye

Answer:

function helloGoodbye() {
  console.log('hello');
  setTimeout(() => console.log('good bye'), 2000);
}

Challenge 4

Create a function brokenRecord that console logs hi again every second. Use the End Code button to stop the console logs when you are satisfied that it is working.

/* CHALLENGE 4 */

function brokenRecord() {
  // ADD CODE HERE
}
// Uncomment the following line to check your work!
// brokenRecord(); // should log (every second): hi again

Answer

function brokenRecord() {
  setInterval(() => console.log('hi again'), 1000);
}

Challenge 5

Create a function limitedRepeat that console logs hi for now every second, but only for 5 seconds. Research how to use clearInterval if you are not sure how to do this.

function limitedRepeat() {
  // ADD CODE HERE
}
// Uncomment the following line to check your work!
// limitedRepeat(); // should log (every second, for 5 seconds): hi for now

Answer:

function limitedRepeat() {
  const intervalId = setInterval(() => console.log('hi for now'), 1000);
  setTimeout(() => clearInterval(intervalId), 5000);
}
limitedRepeat(); 

在这里需要注意的是，The clearInterval() method clears a timer set with the setInterval() method. The ID value returned by setInterval() is used as the parameter for the clearInterval() method.
如果直接把clearInterval的参数以function的形式传入，会报错。

Challenge 6

Write a function called everyXsecsForYsecs that will accept three arguments: a function func, a number interval, and another number duration.

everyXsecsForYsecs will execute the given function every interval number of milliseconds, but then automatically stop after duration milliseconds.

Then pass the below sayHi function into an invocation of everyXsecsForYsecs with 1000 interval time an 5000 duration time. What do you expect to happen?

function everyXsecsForYsecs() {
  // ADD CODE HERE
}
// Uncomment the following lines to check your work!
// function theEnd() {
//   console.log('This is the end!');
// }
// everyXsecsForYsecs(theEnd, 2, 20); // should invoke theEnd function every 2 seconds, for 20 seconds): This is the end!

Answer:

 function everyXsecsForYsecs(func, interval, duration) {
  const intervalId = setInterval(func, interval * 1000);
  setTimeout(() => clearInterval(intervalId), duration * 1000);
}

Source: https://github.com/CodesmithLLC/cs-bin-solutions/blob/master/async.js