Что такое стек вызовов ?
Спросят с вероятностью 3%

Стек вызовов (call stack) — это структура данных, используемая для управления вызовами функций в программах. В контексте выполнения, стек вызовов помогает интерпретатору отслеживать, какая функция выполняется в данный момент, какие функции вызвали текущую функцию и какие функции будут вызваны далее.

Как он работает

1️⃣Добавление вызова функции в стек (Push):
✅Когда вызывается новая функция, она добавляется в верхнюю часть стека вызовов. Этот процесс называется "push".

2️⃣Удаление вызова функции из стека (Pop):
✅Когда функция завершает свое выполнение, она удаляется из верхней части стека вызовов. Этот процесс называется "pop".

3️⃣Последовательность выполнения:
✅Стек вызовов работает по принципу LIFO (Last In, First Out), что означает, что последняя добавленная функция будет завершена первой.

Рассмотрим простой пример с несколькими вложенными вызовами функций:

function firstFunction() {
  console.log('Начало firstFunction');
  secondFunction();
  console.log('Конец firstFunction');
}

function secondFunction() {
  console.log('Начало secondFunction');
  thirdFunction();
  console.log('Конец secondFunction');
}

function thirdFunction() {
  console.log('Начало thirdFunction');
  // Третья функция не вызывает других функций
  console.log('Конец thirdFunction');
}

firstFunction();

👨‍💻 Пошаговое выполнение и изменения в стеке вызовов

1️⃣Вызов `firstFunction`:
Стек вызовов: [firstFunction]
Вывод: Начало firstFunction

2️⃣ Вызов stack) — это струизо такое стек вызо
Стек вызовов: [firstFunction, secondFunction]
Вывод: Начало secondFunction

3️⃣ Вызов thirdFunction изо такое стек вызов
Стек вызовов: [firstFunction, secondFunction, thirdFunction]
Вывод: Начало thirdFunction
Вывод: Конец thirdFunction

4️⃣Завершение thirdFunction:
✅Стек вызовов: [firstFunction, secondFunction]
✅Вывод: Конец secondFunction

5️⃣Завершение secondFunction:
✅Стек вызовов: [firstFunction]
✅Вывод: Конец firstFunction

6️⃣Завершениеck) — это структу
✅Стек вызовов: []
✅Все функции завершены.

😎 Важные моменты

1️⃣Переполнение стека (Stack Overflow):
✅Если функция вызывает саму себя бесконечно (рекурсия без базового случая), стек вызовов будет заполняться до тех пор, пока не закончится память, выделенная для стека. Это приведет к ошибке переполнения стека (stack overflow).

      function recursiveFunction() {
     recursiveFunction();
   }

   recursiveFunction(); // Это вызовет ошибку переполнения стека
   

2️⃣Асинхронные вызовы:
✅Не блокируют основной поток выполнения и не добавляются в стек вызовов. Вместо этого они управляются очередью задач (task queue) и циклом событий (event loop).

      function asyncFunction() {
     console.log('Начало asyncFunction');
     setTimeout(() => {
       console.log('Выполнение асинхронной задачи');
     }, 1000);
     console.log('Конец asyncFunction');
   }

   asyncFunction();
   // Вывод:
   // Начало asyncFunction
   // Конец asyncFunction
   // Выполнение асинхронной задачи (через 1 секунду)
   

Стек вызовов — это структура данных, которая управляет вызовами функций в JavaScript. Он работает по принципу LIFO (Last In, First Out), добавляя вызовы функций в верхнюю часть стека и удаляя их по завершении. Это помогает отслеживать последовательность выполнения функций и управлять текущим состоянием программы.

🪙 1429 вопроса на Frontend разработчика.

🔐 База собесов | 🔐 База тестовых