반응형 javascript 코어 개념35 12. 이벤트 루프(Event Loop) - 3 이벤트 루프의 작동 방식에 따른 코드 실행 순서 이벤트 루프는 JavaScript의 비동기 작업을 관리하고 실행하는 핵심 메커니즘입니다. 브라우저와 Node.js 환경에서 모두 동작하며, 코드 실행 순서를 이해하는 것은 JavaScript 개발자에게 매우 중요합니다. 1. 이벤트 루프의 개념 이벤트 루프는 Call Stack, Callback Queue, Event Table, Event Queue로 구성됩니다. Call Stack: 현재 실행 중인 함수의 호출 정보를 저장하는 곳입니다. Callback Queue: 비동기 작업의 콜백 함수들이 대기하는 큐입니다. Event Table: 비동기 작업과 관련된 이벤트와 콜백 함수의 매핑 정보를 저장합니다. Event Queue: 이벤트 발생 시 콜백 함수가.. 2024. 2. 16. 11. 이벤트 루프(Event Loop) - 2 마이크로태스크(Microtasks)와 매크로태스크(Macrotasks) 마이크로태스크와 매크로태스크는 JavaScript에서 비동기 작업을 처리하는 메커니즘입니다. 이 둘은 이벤트 루프와 함께 동작하여 비동기 작업을 조절하고 실행 순서를 결정합니다. 이번 챕터에서는 마이크로태스크와 매크로태스크의 개념을 설명하고, 각각의 동작 원리와 코드 예제를 통해 이해해보겠습니다. 1. 마이크로태스크와 매크로태스크의 개념 마이크로태스크: Promise의 then, catch, finally 메서드와 queueMicrotask 함수로 생성된 작업들을 의미합니다. 마이크로태스크는 현재 스택이 비어있을 때 즉시 실행됩니다. 매크로태스크: setTimeout, setInterval, requestAnimationFrame과 .. 2024. 2. 16. 10. 이벤트 루프(Event Loop) - 1 이벤트 루프의 개념과 동작 원리 이벤트 루프는 JavaScript의 비동기성을 관리하고 실행 순서를 조절하는 핵심적인 메커니즘입니다. 이를 이해하면 JavaScript의 동작 원리를 파악하는 데 큰 도움이 됩니다. 이번 챕터에서는 이벤트 루프의 개념과 동작 원리를 알아보고, 간단한 코드 예제를 통해 실제 동작을 살펴보겠습니다. 1. 이벤트 루프의 개념 이벤트 루프는 JavaScript 엔진이 비동기적인 작업을 처리하고 실행 순서를 관리하는 메커니즘입니다. JavaScript는 싱글 스레드 언어이기 때문에 이벤트 루프를 통해 동시에 여러 작업을 처리할 수 있습니다. 이벤트 루프는 콜 스택과 태스크 큐를 기반으로 동작합니다. 2. 이벤트 루프의 동작 원리 콜 스택: 함수 호출이 스택에 쌓이고 실행됩니다. 함.. 2024. 2. 16. 9. 비동기 프로그래밍(Asynchronous Programming) - 3 Async/Await를 활용한 비동기 코드의 간결한 작성 방법 JavaScript에서 비동기 코드를 작성할 때 Promise를 사용하는 것보다 Async/Await를 활용하면 더 간결하고 가독성이 좋은 코드를 작성할 수 있습니다. 이번 섹션에서는 Async/Await의 개념과 활용 방법을 알아보고, 간단한 예제를 통해 이를 이해해 보겠습니다. 1. Async/Await의 개념 Async/Await는 JavaScript의 비동기 처리를 위한 문법으로, 함수 앞에 async 키워드를 붙여서 사용합니다. 이를 통해 함수 내에서 Promise를 사용하는 비동기 코드를 동기식처럼 작성할 수 있습니다. Await 키워드는 Promise가 처리될 때까지 함수의 실행을 일시 중지하고, Promise가 이행되면 결과 값.. 2024. 2. 16. 이전 1 ··· 4 5 6 7 8 9 다음 반응형