2023. 5. 16. 20:27ㆍJavascript
이벤트 루프를 이해하기 넘나 좋은 사이트
링크 : http://latentflip.com/loupe/
http://latentflip.com/loupe/
latentflip.com
동기와 비동기의 차이
동기는 먼저 이전의 것이 끝나야 다음 것을 할 수 있다. 줄서는느낌
비동기는 여러가지를 할 수 있다. 운전하면서 노래를 듣고 네비게이션도 확인하며 대화도 가능
- 자바스크립트는 동기 언어이다. 비동기 코드가 있을뿐
console.log() 의 경우 동기이고 setTimeout() 은 비동기이다.
- 힙 : 메모리 할당이 일어남
- 호출 스택 : 실행될 코드를 한 줄 단위로 할당해 동작된다.
- Web APIs : 비동기 처리
- 콜백 큐 : 비동기 처리 후 실행되야할 콜백 함수가 순서대로 할당
- 이벤트 루프 : 큐에 할당된 함수를 순서에 맞춰 호출 스택에 저장
링크로 들어가서 해보는게 이해가 훨씬잘되는듯
추가적으로 아래 연습해본 링크!!
https://muyeon95.tistory.com/181
호출 스택 이벤트 루프(1) [ TIL ] [ Javascript ]
Problem 호출 스택의 간단한 동작원리를 알아보장 Try 말 그대로 스택(LIFO)은 자료구조인데 호출 스택(call stack) 은 함수 호출의 실행 순서를 기록하는 스택 자료구조 이다. 함수가 호출되면 해당 함
muyeon95.tistory.com
https://muyeon95.tistory.com/182
Web API 이벤트루프(2) [ TIL ] [ Javascript ]
Problem Web API 에 대해서 알아보장 Try Web API 는 브라우저에서 제공하는 API 로 DOM, Ajax, TimeOut 등이 있다. CallStack 에서 실행된 비동기 함수는 Web API 를 호출하고, Web API 는 콜백 함수를 테스크 큐에 넣
muyeon95.tistory.com
https://muyeon95.tistory.com/183
태스크 큐 이벤트루프(3) [ TIL ] [ Javascript ]
Problem 태스크 큐에 대해서 알아보장 Try 태스크 큐는 두가지 종류라고 한다. 첫번째는 마이크로 태스크 큐, 두번째는 태스크 큐 이렇게 두개의 태스크 큐가 존재한다. 마이크로 태스크는 자신을
muyeon95.tistory.com
'Javascript' 카테고리의 다른 글
| Javascript Async / Await (0) | 2023.05.16 |
|---|---|
| Javascript 프로미스 ( Promise ) (0) | 2023.05.16 |
| Javascript 클로져 ( Closure ) (0) | 2023.05.16 |
| Javascript OOP 상속 (0) | 2023.05.16 |
| Javascript ES6 Classes (0) | 2023.05.16 |