자바스크립트 콜스택(Call Stack)

2022.05.16

비동기처리방식

함수호출 -> 코드평가 -> 함수실행컨텍스트생성 -> 실행컨텍스트 스택(=콜스택)에 push(실행순서관리) -> 함수실행 -> 종료(콜스택에서) pop

1. 콜스택에 webAPIs인건 전달을 받아 콜백큐에 쌓여있다
2. 이벤트루프를 통해서 (콜백)큐에 쌓여있는걸 언제 출력할까?
3. 콜스택이 비워지면

!!!!이벤트루프를 적용해보자 click!!!!!

위 사이트에 아래의 예시를 넣고 실행순서를 확인해보자

setTimeout(function () {
    console.log(3)
},3000)

function a () {
    console.log(1)
    function b() {
        console.log(2)
    }
    b()
}
a()

자바스크립트는 한번에 하나의 테스크만 실행 가능하기때문에 싱글스레드(single thread) 라 부르며, 브라우저에 내장된 자바스크립트 엔진이 작동함
자바스크립트는 단 하나의 콜스택(callstack)을 갖음
대표적으로 webAPIs에저 지원하는 명령 DOM, AJAX, Timeout

비동기와 동기방식의 차이

비동기: 블로킹(작업중단)현상 발생하지 않음
동기: 실생순서를 보장해 주지만, 블로킹 발생

이벤트루프(Event Loop)

자바스크립트에서 동시성(concurrency)지원
브라우저에 내장된 기능
순차적(FIFO:First In First Out)으로 태스크큐에 대기중인 함수를 콜스택에 이동

메모리 힙(Memory Heap)

객체가 저장되어 있는 장소
메모리 공간크기는 런타임때 결정되어서 구조화되어있지 않음
콜스택의 요소인 실행컨텍스트는 힙에 저장된 객체를 참조함

끄적...
node는 로컬을 제어하는 환경
자바스크립트는 브라우저를 제어하는 환경
ESM방식과 CommonJS방식이 다르다