동기

방식은 서버에서 요청을 보냈을 때 응답이 돌아와야 다음 동작을 할 수 있습니다.

요청이 들어온 순서에 맞게 하나씩 처리하는 방식으로, 순서에 맞춰 진행되는 장점이 있지만 여러가지 요청을 동시에 처리할 수 없습니다.

따라서 결과가 주어질 때까지 대기해야 하는 문제가 있습니다.

비동기

방식은 서버에 요청을 보냈을 때 응답여부와 상관없이 다음 동작을 할 수 있습니다.

동기보다 복잡하고 결과가 주어지는데 시간이 걸리더라도 그 시간동안 다음 동작을 할 수 있어 보다 효율적입니다.

비동기 처리의 대표적인 예는 setTimeout()입니다. 코드를 바로 실행하지 않고 지정한 시간만큼 기다렸다가 로직을 실행합니다.

비동기 처리는 그 결과가 언제 반환될지 알 수 없기 때문에 동기식으로 처리하는 기법들이 사용되어야 합니다.

대표적으로 setTimeout이 있고 callback과 promise가 있습니다.

세 가지 모두 비동기 코드를 동기식으로 작성하는 기법입니다.

ES7에서 async, await 키워드가 추가되었습니다.

async, await 키워드를 사용하면 비동기 코드를 마치 동기 코드처럼 보이게 작성할 수 있습니다.

async, await은 기존 동기식 처리의 단점을 보완하고 가독성을 높혀주는 코드를 작성할 수 있습니다.