자바스크립트 코드를 읽고 실행시키는데 엔진이 해야할 일은 다음과 같다.
1. 변수, 객체등등 app의 데이터를 저장한다.
2. 코드에서 어떤일이 일어나는지 계속 추적한다.
다음의 일을 수행하기 위해 JS엔진은 콜스택과 매모리힙으로 구성되어있다.
Memeory Heap
- 데이터를 저장하기 위해 우리는 메모리에 이 데이터를 할당해야 하는데 이를 담당하는 곳이 메모리 힙이다.
- 객체, 배열, 함수와 같은 참조타입 값이 저장된다.
- 메모리 힙은 정렬되지 않은 큰 저장소이다. 데이터는 변수라는 라벨이 붙어 이 저장소에 저장되고 호출될 때 변수로 저장된 위치를 알 수 있다.
CallStack
-
콜스택은 원시타입의 데이터와 함수 호출이 저장되는 곳이다.
-
함수가 메모리에 할당되고 함수를 호출할 때마다 메모리에서 함수를 찾아서 실행한다. 함수의 호출 시 지역 변수와 매개 변수가 저장되는 되는 임시 메모리 영역이다.
memory which operates in first in last out mode
the call stack stores function and variables as your code execute at each entry state of the stack also called the stack frame
- 스택 영역에 저장되는 함수의 호출 정보가 stack frame이다.
- 콜 스택으로 현재 어떤 코드가 실행되는지 알 수 있다. 해당 함수 호출이 완료되면 스택에서 함수를 pop-off된다.
Call Stack & Memory Heap
- 원시 타입의 값은 Call Stack에 저장되고 참조 타입의 값은 Memory Heap 영역에 저장된다
var text = '텍스트';- '텍스트'는 원시 타입이므로 Call Stack에 저장된다
- 변수 text에는 '텍스트'가 저장된 Call Stack의 주소값이 저장된다.
Stack Overflow
스택의 사이즈를 초과 했을 때 발생하는 오류로 재귀함수 호출하거나 중첩함수가 서로를 호출할 때 흔하게 발생할 수 있다. 브라우저가 crashing되는 걸 막기 위해 maximum size를 정해두었다. 이 사이즈를 초과하면 에러가 발생한다.
🌞