자바스크립트는 싱글스레드 방식으로 동작한다 === 콜 스택이 하나다 === 동시에 하나의 일만 처리할 수 있다
힙
자바스크립트 파일 실행시 변수, 객체 등 실행에 필요한 데이터들이 메모리에 저장되는 공간
백그라운드( Web APIs )
자바스크립트가 비동기적으로 작업을 처리할 수 있게 해주는 공간
비동기 작업 : 특정 작업을 시작하고 기다리는 동안 다른 작업을 수행할 수 있도록 해줌
백그라운드에서 실행되는 작업
타이머 작업 : setTimeout, setInterval , 백그라운드에서 타이머를 세고, 타이머가 완료되면 태스크 큐로 콜백 함수를 보냄
이벤트 기반 작업 : 클릭, 키보드, AJAX요청, XMLHttpRequest 이벤트등 이벤트를 백그라운드에 등록하고 대기하고 있다가 해당 이벤트가 발생하면 발생한 이벤트에 대한 콜백함수를 태스크 큐에 보내 함수를 실행함
Promise: 백그라운드에서 실행되는 비동기 작업의 결과를 대기함, 완료되면 콜백함수를 태스크 큐로 보내 콜 스택이 비면 태스크 큐에 있는 작업을 실행함 , 이때 태스크큐에 있는 작업의 우선순위는 일반 작업보다 promise의 우선순위가 높음
태스크 큐
비동기 작업의 콜백함수 와 관련된 이벤트들을 저장하는 자료구조
백그라운드에서 시간이 만료됐거나, 발생한 이벤트들에 대한 작업을 큐에 저장하고 콜스택이 비면 저장된 순서대로 콜백함수를 실행함 => 다른 작업보다 promise의 우선순위를 먼저처리함(새치기)
이벤트루프
콜 스택과, 태스크 큐를 주시하고 있다가 호출스택이 비게 되면 태스크 큐에 있는 콜백함수를 콜 스택으로 옮겨주어 코스택에서 콜백 함수가 실행되도록 해주는 역할
콜백 함수
함수안에 인자로 들어가 있느 함수
콜백 수신 함수에 의해 특정 시점에 실행
동기 콜백의 경우 호출 즉시 실행
비동기 콜백의 경우 조건을 만족했을때, 이벤트 리스너, 타이머, AJAX요청 등
예시 코드
1.실행 컨텍스트 예측
function multiply(a, b) {
return a * b;
}
function square(n) {
return multiply(n, n);
}
function printSquare(n) {
let squared = square(n);
console.log(squared);
}
printSquare(4);