1. 기본 의미
-
동기란?
: 동시에 일어난다.
: 요청이 발생했을 때, 시스템은 곧바로 해당 요청에 대한 리턴값을 반환한다. (= 작업을 처리한다.)
: 순차적. -
비동기란?
: 동시에 일어나지 않는다.
: 요청이 발생하더라도 곧바로 값이 반환된다는 보장이 없다. (처리 순서에 대한 보장x)
: 병렬.
이렇게 보면 동기가 설계하기도 편하고 무조건 좋아보이는데 어떠한 차이가 있는지 좀더 자세히 알아보자.
2. 차이점
0. 상황을 가정해보자
사용자는 총 3개의 요청을 시스템에 보내야한다.
(요청1, 요청2, 요청3)
1. '동기'의 경우
요청이 발생하면 무조건 이후의 액션이 따라와야만 한다.
요청1이 들어오면 이것이 해결되어야만 요청2로 넘어가고, 또다시 요청2가 해결되어야만 요청3으로 넘어갈 수가 있다.
네트워크 상태가 좋지 않아 요청1에 대한 처리가 늦어질 경우, 시스템은 요청1이 해결될 때까지 대기 상태로 있다가 이것이 해결된 후에야 비로소 요청2로 넘어간다.
2. '비동기'의 경우
요청1이 들어오고, 아직 결과값이 반환되지 않았더라도 시스템은 마냥 기다리지 않는다. 요청2를 받고, 요청3도 받는다. 도중에 요청에 대한 작업이 완료되었다면 언제든, 완료되는 즉시 결과값을 반환해준다.
3. 실제 사용
받아와야하는 데이터의 양이 많아질수록 대기시간도 길어진다.
동기라면 새하얀 화면에서 마냥 데이터가 모두 받아와지길 기다려야하지만, 비동기라면 일단 구성할 수 있는 레이아웃은 먼저 그려놓고 조금 늦어지는 데이터를 이후에 채워넣는다.
Callback, Promise, Async/Await이 이러한 역할을 수행한다.
(비동기 함수를 동기 함수로 만드는 방법)
※ 자바스크립트에서 어떻게 비동기 방식이 가능하는가
자바스크립트는 기본적으로 싱글스레드로 동작한다. 반면에 비동기 방식은 여러 개의 작업이 동시에 이루어져야하기 때문에 다중스레드를 필요로 한다.
보통 자바스크립트를 웹 브라우저 혹은 Node.js의 환경에서 구동시키는데, 이들은 자바스크립트 엔진 뿐만이 아니라 비동기식 처리 모델인 Web API를 함께 지원해주기 때문에 가능한 것이다.
