웹 브라우저가 JS를 읽고 동작하는 방식에 대해 정리하고 개념화 하려고 한다.
1. Stack
자바스크립트는 기본적으로 stack에 쌓이는 실행 대상을, 순서에 따라 동기적으로 처리한다.
그 처리는 한 번에 하나씩 처리 된다.
2. Heap
실행되는 대상이 변수에 저장된 값 등을 필요로 할 때, 이들을 저장하는 공간은 heap이라고 한다.
heap이 없이는 stack의 실행 요소들이 제대로 작동하지 못 한다.
3. Queue
데이터 통신을 위한 객체 (ajax, axios 등)/ event listener/ 타이머 요소들 (setTimeout) 들은 stack으로 바로 진입하지 못 하고, queue라는 공간을 거친다. 이 곳에서 처리가 된 상태로 대기해야 하고, stack이 비로소 모든 작업을 실행하고 나면, 순서대로 stack으로 이동된 뒤에 처리 된다.
우리는 개발 학습을 통해, 그 이면의 원리를 이해 하지 못 한 상태에서도, 자바스크립트를 동기적/ 비동기적으로 잘 사용해 왔다. 그러나 만약 우리가 의도 하지 않게 자바스크립트가 동작하게 된다면, 이런 근본적인 원리로 부터 그 답을 찾아나가면 될 것.
Frontend Engineer