스코프와 호이스팅
스코프 : 변수를 사용할 수 있는 범위
호이스팅 : JS에서는 변수와 함수의 선언이 스코프 최상단으로 끌어올려지는 것
var : 전역 스코프 / 호이스팅 o, 초기화 x > undefind
let, const : 블록 스코프 / 호이스팅 o, TDZ > 레퍼런스 에러 (재선언 가능여부 차이)
클로저
함수와 그 함수가 선언된 렉시컬 환경의 조합.
→ 변수를 직접 수정할 수 없도록 숨겨두고 (은닉), 선언한 위치를 기억하여 값을 사용할 수 있게 하는 것
useState : 상태 값을 숨기고 업데이트 함수를 제공
주의할 점
메모리 차지를 많이하기 때문에 추가 비용이 발생하는 것을 고려해야함
이벤트 루프
javascript는 싱글 스레드이기 때문에 한 번에 하나의 작업만 동기적(직렬)으로 처리
→ 그렇다면 비동기 작업은 어떻게 이루어질까?
이벤트 루프 : 호출 스택(call 스택)이 비워져있는지 체크하는 역할
호출 스택 : 수행해야 할 코드나 함수를 순차적으로 저장 (todo list 같은 느낌)
태스크 큐 : 실행해야 할 태스크의 집합 (오래된 것부터 처리)
이벤트 루프가 호출 스택에 실행중인 코드가 있는지, 태스크 큐에 대기중인 함수가 있는지 확인한다. 호출 스택이 비어있다면 태스크 큐에 대기중인 작업이 있는지 확인, 실행 가능한 것부터 순차적으로 호출 스택에 넣어서 실행한다. 이 과정을 호출 스택과 태스크 큐가 빌 때까지 반복
setTimeOut과 fetch등의 네트워크 요청은 외부 Web API를 통해 이루어진다.
외부에서 실행되고 콜백이 태스크 큐로 들어가는 것.
마이크로 태스크 큐 : 태스크 큐보다 우선권이 높다. (Promise)
→ setTimeOut보다 Promise가 먼저 처리된다.
마이크로 태스크 큐와 태스크 큐 사이에서 렌더링이 일어난다.
