1
state를 사용하는 이유 - 리렌더링 대상 컴포넌트를 확인하기 위해서 (state 변경 === 리렌더링)
state 관리 방법 - depth가 2-3인 경우 props-drilling, zustand, tanstack-query
2
동기: 순차적으로 실행. 1 - 2 - 3번째 줄이 끝나야 실행.
비동기: 이전 작업을 기다리지 않고 여러 작업을 동시에 실행.
비동기의 필요성
- 대표적인 비동기 = 네트워크 통신
네트워크 통신이 동기라면 끝날 때까지 기다려야 하므로
유저 경험 저하. 프로그램 느려짐
3
비동기 작업을 위해 사용되는 문법이다.
이것들이 없을 때는 callback을 사용했었음 콜백 지옥에 빠지는 문제 발생. -> Promise
Promise 순서대로 처리해야 할 비동기 작업이 많은 경우,
함수 chaining 때문에 코드가 지저분함. (callback 지옥이랑 다른건가?)
async await는 동기적인 흐름으로 작성 가능해서 직관적임.
async 함수의 반환타입은 Promise.
Promise 앞에 await를 붙이는 것
4
이벤트루프는 어떤 작업을 우선으로 동작시킬 것인지 결정하는 세심한 컨트롤을 하기 위해 존재하는 것이다.
콜스택 이벤트큐(메시지큐) 이벤트루프로 구성된다.
코드가 실행되면
콜스택에 순차적으로 쌓이는데
비동기 작업을 만나면 서브 쓰레드에서 다음 작업이 바로 실행된다.
비동기 작업이 실행되고 나서 (서브 쓰레드에서) << 서브 쓰레드가 여러개인가?? 큐에 들어감
이벤트루프가 콜스택과 이벤트큐를 계속 보면서
콜스택이 비었는지 확인하고 비었으면 큐에서 완료된 작업을 꺼내서 콜스택에 반환
콜스택에서 실행
논리쓰레드 new Thread() - 무제한 | 물리쓰레드 4코어 (CPU)
