Call Stack

Question 1

What is the Call Stack?

Answer 1

The call stack is the JS compilers todo list. The elements in the stack are pulled in until there is nothing left, at which point the last element will be executed and popped off the stack.

Question 2

When is a stack overflow error triggered?

Answer 2

When there are 16000 entries in the stack.

Question 3

How can you track code moving through the call stack?

Answer 3

With Chrome DevTools. Open the file you want to track in sources and add a breakpoint. You can see the call stack in the right hand panel.

Question 4

In what order is the following code added to the stack and executed?

function greeting() {
  sayHi();
}

function sayHi() {
  return "Hi!";
}

greeting();

console.log('all done')

Answer 4

The compiler will skip over the initial functions and look for the first executable call, greeting(). This is added to the stack, followed by sayHi(). at this point the stack looks like below. The top of the stack returns “Hi”, and is popped off, followed, by greeting().

say(hi)
greeting()
main()

Then console.log is added and executed before the stack is cleared.