¿Qué es la pila de llamadas en JavaScript?

JavaScript utiliza la pila de llamadas para realizar un seguimiento de varias llamadas a funciones. Es como una pila real en estructuras de datos donde los datos se pueden empujar y sacar y sigue el principio de último en entrar, primero en salir (LIFO). Usamos la pila de llamadas para memorizar qué función se está ejecutando en este momento. El siguiente ejemplo demuestra la pila de llamadas.

Ejemplo:

function f1() {
  console.log('Hi by f1!');
}
  
function f2() {
  f1();
  console.log('Hi by f2!');
}
  
f2();

Producción:

"Hi by f1!"
"Hi by f2!"

Explicación:

Los pasos y las ilustraciones a continuación explican la pila de llamadas de la función anterior.

Paso 1: cuando el código se carga en la memoria, el contexto de ejecución global se inserta en la pila.

Paso 2:  se llama a la función f2() y el contexto de ejecución de f2 ( ) se coloca en la pila.

Paso 3: comienza la ejecución de f2() y, durante su ejecución, se llama a la función f1() dentro de la función f2() . Esto hace que el contexto de ejecución de f1() se inserte en la pila de llamadas.

Paso 4:  ahora la función f1() comienza a ejecutarse. Un nuevo marco de pila del método console.log() se insertará en la pila.

Paso 5: cuando se ejecuta el método console.log() , imprimirá «Hola por f1» y luego se extraerá de la pila. El contexto de ejecución volverá a la función y ahora no queda ninguna línea de código en la función f1() , como resultado, también se extraerá de la pila de llamadas.

Paso 6: Esto sucederá de manera similar con el método console.log() que imprime la línea «Hola por f2» y luego, finalmente, la función f2() terminará y se eliminará de la pila.