2020. 3. 5. 09:57ㆍ웹/Javascript
콜 스택(Call Stack)과 메모리 힙(Memory Heap)
메모리 힙(Memoery Heap)
-
정보를 저장하는 공간
-
Memory Allocation 이 발생하는 공간
-
객체는 대부분 구조화 되지 않은 메모리 영역인 힙 역역 내부에 할당
콜 스택(Call Stack)
-
실행 중인 코드를 트래킹하는 공간
-
자바스크립트 코드 실행을 위해 제공된 싱글 스레드
-
메모리 힙에서 작업 수행에 필요한 것을 찾아 수행하는 공간
Javascript Engine 내부 구조
콜 스택(Call Stack) 동작 과정
var value = "value1";
function printFunc() {
var value = "value2";
function printValue() {
return value;
}
console.log(printValue());
}
printFunc();
단계 1)
자바스크립트 파일이 실행이되면 전역 실행 컨텍스트(Global Execution Context)가 가장 먼저 실행이 되면서, 이 영역에 anonymous 라는 함수가 콜 스택에 쌓임. 함수 이름이 anonymous 인 이유는 자바스크립트 파일의 이름이 현재 없기 때문.
단계 2)
printFunc 함수를 읽으면서 이 함수가 콜 스택에 두번째로 쌓이게 됨.
단계 3)
변수 할당 과정이 이루어지며 메모리 힙을 참고하여 코드 실행에 필요한 변수, 함수 등의 위치를 참조하며 실행.
간단한 변수들은 콜 스택에 저장되고, 객체, 배열, 함수 등 복잡한 데이터 구조 값들은 메모리 힙에 저장.
단계 4)
printValue 라는 함수를 실행하기 위해 함수 내부로 이동하게 되며 콜 스택에 쌓이게 됨.
단계 5)
함수가 반환되면서 콜 스택에서 제거. 이 과정을 반복하며 전역 실행 컨텍스트 함수까지 콜스택에서 제거되면서 모든 수행이 종료.
콜 스택을 통해 현재 코드가 어디에 위치해 있는지 트래킹이 가능하며, 이 과정에서 메모리 힙을 참고하여 코드 실행에 필요한 변소, 함수 등의 위치를 참조하며 실행.
출처
https://new93helloworld.tistory.com/358
'웹 > Javascript' 카테고리의 다른 글
this 정체 (0) | 2020.03.05 |
---|---|
DOM(Document Object Model) (0) | 2020.03.05 |
Javascript Runtime (0) | 2020.03.05 |
브라우저 랜더링 (0) | 2020.03.02 |
자바스크립트 엔진 - V8 (0) | 2020.03.02 |