JS

자바스크립트 비동기와 동기

영프로95 2022. 5. 16. 00:50
I/O Bound 작업 DB, 파일시스템, 네트워크 등을 다루는 작업
CPU Bound 작업 CPU 자원을 사용하는 일을 다루는 작업

기본적으로 자바스크립트(이하 JS) 의 함수는 콜스택(Call Stack)에 쌓였다가 pop이 되면서 동기적으로 실행된다.

하지만 web APIs의 setTimeout 함수, I/O Bound작업은 콜스택에 쌓인 다음 바로 web APIs의 백그라운드 공간으로 넘어간 후 비동기적으로 완료가 되면 콜백큐(Callback queue)에 쌓이고 이벤트 루프(Event loop)를 이용해 다시 콜스택에 쌓여 호출된다.

 

위의 내용의 에니메이션

http://latentflip.com/loupe/?code=JC5vbignYnV0dG9uJywgJ2NsaWNrJywgZnVuY3Rpb24gb25DbGljaygpIHsKICAgIHNldFRpbWVvdXQoZnVuY3Rpb24gdGltZXIoKSB7CiAgICAgICAgY29uc29sZS5sb2coJ1lvdSBjbGlja2VkIHRoZSBidXR0b24hJyk7ICAgIAogICAgfSwgMjAwMCk7Cn0pOwoKY29uc29sZS5sb2coIkhpISIpOwoKc2V0VGltZW91dChmdW5jdGlvbiB0aW1lb3V0KCkgewogICAgY29uc29sZS5sb2coIkNsaWNrIHRoZSBidXR0b24hIik7Cn0sIDUwMDApOwoKY29uc29sZS5sb2coIldlbGNvbWUgdG8gbG91cGUuIik7!!!PGJ1dHRvbj5DbGljayBtZSE8L2J1dHRvbj4%3D 

 

http://latentflip.com/loupe/?code=JC5vbignYnV0dG9uJywgJ2NsaWNrJywgZnVuY3Rpb24gb25DbGljaygpIHsKICAgIHNldFRpbWVvdXQoZnVuY3Rpb24gdGltZXIoKSB7CiAgICAgICAgY29uc29sZS5sb2coJ1lvdSBjbGlja2VkIHRoZSBidXR0b24hJyk7ICAgIAogICAgfSwgMjAwMCk7Cn0pOwoKY29uc29sZS5sb2coIkhpISIpOwoKc2V0VGltZW91dChmdW5jdGlvbiB0aW1lb3V0KCkgewogICAgY29uc29sZS5sb2coIkNsaWNrIHRoZSBidXR0b24hIik7Cn0sIDUwMDApOwoKY29uc29sZS5sb2coIldlbGNvbWUgdG8gbG91cGUuIik7!!!PGJ1dHRvbj5DbGljayBtZSE8L2J1dHRvbj4%3D

 

latentflip.com

를 참고하면 가시적으로 확인할수 있습니다.

'JS' 카테고리의 다른 글

IIFE  (0) 2022.07.13
함수형 프로그래밍 1탄  (0) 2022.07.07
Lazy Loading  (0) 2022.07.03
올바르게 객체 복사하기  (2) 2022.06.30
이터러블 이터레이터 제너레이터  (1) 2022.05.22