자바스크립트는 동기식인가 비동기식인가?

Hong's·2024년 4월 17일

자바스크립트 및 CS

목록 보기
4/13

오늘은 콜백 함수에 대해서 내용 정리를 하려고 했지만 콜백 함수를 잘 이해를 하려면 우선 동기 비동기, 이벤트 루프에 대해서 알아야 한다고 생각이 들어서 먼저 동기, 비동기에 대해 내용 정리를 하려고 합니다.

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

자바스크립트는 싱글 스레드 기반 언어이기 때문에 한 번에 여러 개의 일을 하지 못하고 1개씩만 해결해 나가는 동기적으로 작동합니다. API나 시간이 오래걸리는 작업을 하면 프로젝트 실행시 딜레이가 생기게 되고 이를 해결하기 위해 비동기처리가 나타나게 되었습니다.

비동기 동작은 자바스크립트가 핵심이 아니고 브라우저가 가지고 있습니다. (이벤트 루프)

우선은 동기와 비동기를 알아봅시다.

동기

일을 순차적으로 1개씩 처리를 합니다.
사용자가 데이터를 서버에 요청 시 그 서버가 데이터 요청에 따라 응답을 사용자에게 다시 주기까지 다른 활동을 할 수 없이 기다려야 합니다.

비동기

여러 가지 일을 동시에 처리가 가능합니다.
사용자가 데이터를 서버에 요청 시 응답을 기다리지 않고 다른 활동을 수행해도 되고 서버에게 다른 데이터를 요청해도 상관이 없습니다.

장단점

동기
장점 : 설계가 간단하고 실행 순서 보장
단점 : 작업이 시작되면 끝날때 까지 다른 행동을 못한다.


비동기
장점 : 작업이 시작되어도 다른 행동을 할 수 있다.
단점 : 동기식보다 설계가 복잡하고 실행 순서 보장이 안된다.

자바스크립트 동시성

자바스크립트는 싱글 스레드 기반 언어이다. 호출스택(call stack)이 한 개라 한가지 일만 수행이 가능하다는 것을 의미 함. 그러나 callback함수나 setTimeout등은 비동기로 수행이 된다. 호출스택이 하나인데 동시성 지원이 가능한 이유는 브라우저에서 event loop라는 친구 덕이다.

event loop는 다음 글에서 작성을 해보려고 합니다.

자바스크립트는 싱글스레드 방식으로 동작하지만 (자바스크립트 엔진에 의해) 브라우저는 멀티스레드로 동작하기 때문에 비동기 처리가 가능하다.

profile
이것저것 공부 이야기

0개의 댓글