Functions 2

Question 1

What does this code do?

function sayHi() {
  console.log('Hello');
}

setTimeout(sayHi(), 1000);

Answer 1

error

Question 2

What does this code do?
function sayHi() {
  console.log('Hello');
}

setTimeout(sayHi, 1000);

Answer 2

logs “hello” after 1 second

Question 3

1. Do a function after a set amount of time

2. Keep doing a function on an interval

Answer 3

1. let timerId = setTimeout(func|code, [delay], [funcArg1], [funcArg2], …)
2. let timerId = setInterval(func|code, [delay], [funcArg1], [funcArg2], …)

Question 4

What does
setTimeout()
do or return?

Answer 4

Does a function after a set amount of time

Returns an ID unique to that instance of setTimeout that can be used to cancel the timer
let timerId = setTimeout(func|code, [delay], [funcArg1], [funcArg2], ...)

Question 5

What can go into the setTimeout() function parameter?

Answer 5

1. Callback function name
2. Function expression
3. A string with code that will be executed (like with new function. Don’t do it though)

Question 6

What does this code do?
let variable = setTimeout(...);

Answer 6

Returns a “timer identifier” timerId that we can use to cancel the execution.
let timerId = setTimeout(() => alert(“never happens”), 1000);
alert(timerId); // timer identifier

clearTimeout(timerId);
alert(timerId); // same identifier (doesn’t become null after canceling)

BUT

It can depend on the environment. Some environments return the setTimeout object with more methods on it
There is no universal specification for these methods, so that’s fine.

Question 7

What does this code do?
function sayHi() {
  console.log('Hello');
}

setInterval(sayHi, 1000);

Answer 7

logs “hello” every 1 second

Question 8

Create an repeating interval where a function will execute.

Cancel that interval after a set number of seconds

Answer 8

// repeat with the interval of 2 seconds
let timerId = setInterval(() => alert('tick'), 2000);

// after 5 seconds stop
setTimeout(() => { 
  clearInterval(timerId); 
  alert('stop'); 
}, 5000);

Question 9

Create an interal using setTimeout instead of setInterval()

Answer 9

let timerId = setTimeout(function tick() {
  alert('tick');
  timerId = setTimeout(tick, 2000); // (*)
}, 2000);

Question 10

What is 1 benefit to using a setTimeout interval vs setInterval and 1 difference

Answer 10

Benefit:
with setTimeout we can effect the interval as it goes.

Difference:
setInterval executes the function every xms regardless of the time it takes to execute the function.
If it takes longer than xms it executes the next round right away,
setTimeout executes the next round as part of the code and can be made to wait till the code executes before performing the next round.

Question 11

Why must you always run clear interval on setInterval/setTimeout?

Answer 11

When a function is passed in setInterval/setTimeout, an internal reference is created to it and saved in the scheduler. It prevents the function from being garbage collected, even if there are no other references to it.

For setInterval the function stays in memory until clearInterval is called.

A function references the outer lexical environment, so, while it lives, outer variables live too. They may take much more memory than the function itself. So when we don’t need the scheduled function anymore, it’s better to cancel it, even if it’s very small.

Question 12

What is returned from this code
setTimeout(() => console.log("Hello"));
console.log("World");
OR
setTimeout(() => console.log("Hello"), 0);
console.log("World");

How about:
setTimeout(() => console.log(“Hello”), 100);
console.log(“World”);

Answer 12

World Hello all 3 cases

This schedules the execution of the function as soon as possible. But the scheduler will invoke it only after the CURRENTLY EXECUTING script is complete.

Question 13

How does this code:

function printNumbersB(from, to) {
  function logger(x) {
    console.log(x);
    if (x > to) {
      return;
    }
    setTimeout(logger, 10, ++from);
  }
  logger(from, to); 
 }

Differ from this code:

function printNumbersB(from, to) {
  function logger(x) {
    console.log(x);
  }

  if (from > to) {
    return;
  } else {
    setTimeout(logger, 10, from);
    printNumbersB(++from, to);  
  }
}

Answer 13

The top code logs numbers, sets a timer to log a number and set another timer.
A number is logged every 10 ms.

The bottom code sets a time to log a number and immediately goes to the next recursive step.
The numbers are spewed out (basically) all at once after 10 ms

Question 14

When will the scheduled function run?

• After the loop.
• Before the loop.
• In the beginning of the loop.

What is alert going to show?

let i = 0;
setTimeout(() => alert(i), 100); 
for(let j = 0; j < 100000000; j++) {
  i++;
}

how about with

let i = 0;
setInterval(() => alert(i), 100); 
for(let j = 0; j < 100000000; j++) {
  i++;
}

Answer 14

After the loop

It will alert 100000000 100 ms after the loop

Same thing with setInterval. It starts logging 100000000 every 100ms after the loop has executed

Question 15

What does this return?
let initGame = () => ({
level: 1,
score: 0
});

Answer 15

Returns an object: {
level: 1,
score: 0
}

Question 16

What does this return?
let initGame = () => {
level: 1,
score: 0
};

Answer 16

An error.
It doesn’t read it as an object because it’s on multiple lines.

Question 17

What does this return?
let initGame = () => { level: 1, score: 0 };

Answer 17

Returns an object: {
level: 1,
score: 0
}