async / await

동기(Synchronous) (단일 스레드, 싱글 스레드)

한 작업이 실행되는 동안

다른 작업은 멈춘 상태를 유지하고 자신의 차례를 기다리는 것

1. 동시에 여러 작업을 수행할 수 없음

2. 흐름을 예측하기 쉬움

3. 먼저 수행되고 나중에 수행되는 것들이 명확

 

비동기(asynchronous)

응답에 관계없이 바로 다음 동작이 실행되는 방식

웹 페이지가 로딩되거나, 이벤트가 30초 이상이 걸린다면,

웹 페이지는 이 동작이 끝날 때까지

화면에 나타나지 않거나 다음 동작에 지장을 주게 된다.

또, 요즘 사용자들은 이런 웹 사이트를 원하지 않는다.

(느리고 응답이 없는)

그렇기 때문에

자바스크립트가 웹 사이트에서 동작할 때,

비동기적으로 동작할 수 있어야 한다.

1. 동시에 여러 작업을 수행할 수 있음

2. 흐름을 예측하기 어려움

3. 무엇이 먼저 완료될 지 보장할 수 없음

 

Promise

자바스크립트에서 비동기 처리에 사용되는 객체
코드는 실행 됐지만 결과를  반환하지 않은 객체

1. 비동기 처리를 아직 수행하는 Pending,
2. 비동기 처리가 완료되어 값을 반환한 Fulfilled, 

3. 비동기 처리가 어떠한 이유에서 실패한 Rejected,

 

async

함수를 선언할 때 붙여주는 키워드

 

await

Promise가 fulfilled 또는 rejected이 될 때까지 기다리는 함수

 

async / await

Promise와 굉장히 밀접한 연관을 가짐

 

사용하는 이유

1. 에러 위치를 찾기 쉬움

2. (async는) 가독성이 좋습니다.

3. ( async는) 에러 핸들링에 유리합니다.