Call Stack page
Learn how to trace how functions are called.
The problem
What is the name of the function that calls the end
function below?
<script src="//bitovi.github.io/academy/static/scripts/debugging/variables.js"></script>
<script type="module">
function end() {
console.log("What is the name of the function that calls end?");
debugger;
}
start();
</script>
What you need to know
In the following code, a()
calls b()
, b()
calls c()
, and c()
calls d()
:
function a(){
var varA = "A";
b();
}
function b(){
var varB = "B";
c();
}
function c(){
var varC = "C";
d();
}
function d(){
var varD = "D";
}
a();
By adding a breakpoint in d()
, you will see the following in the Call Stack:
Chrome can also track asynchrounous function calls. In the following code,
setTimeout
is used to call the next function:
function a(){
setTimeout(b,10);
}
function b(){
setTimeout(c,10);
}
function c(){
setTimeout(d,10);
}
function d(){
console.log("d");
}
a();
By adding a breakpoint in d()
, you will see the following in the Call Stack:
The solution
Click to see the answer
The answer is e
.