동기 처리와 비동기 처리

실행 컨텍스트 내 테스크 중 실행 중인 테스크가 끝나야 다음 테스크로 넘어가는 방식을 동기처리라 하며 현재 실행 중인 테스크가 끝나지 않아도 다음 테스크로 넘어가는 방식을 비동기라 한다.

동기 방식은 실행 순서가 보장되지만 실행 중인 테스크가 종료되기 전까지 다른 테스크가 블로킹당하는 단점이 있다. 반대로 비동기 방식은 테스크가 실행중이여도 블로킹당하지 않는 장점이 있지만 실행순서가 보장되지 않는다는 단점이 있다.

콜백패턴으로는 안되나?

콜백함수란? 함수를 특정 시점에 도달하였을 때 실행되는 함수이다. 콜백함수를 이용하여 비동기 처리가 가능하지만 콜백의 중첩으로 인한 코드의 가독성 및 복잡도가 높아지며 에러 처리의 한계로 인한 단점이 있기 때문에 이를 보완하기 위하여 ES6부터 만든 Promise를 사용한다.

Promise

ES6에 도입된 ECMA Script 사양에 정의된 표준 빌트인 객체로서 new연산자와 Promise생성자 함수를 사용하여 새로운 Promise를 생성 가능하다. Promise 생성자 함수는 비동기 처리를 할 콜백 함수를 인수로 전달 받으며 콜백함수는 resolve와 reject를 인수로 전달 받는다. resolve는 비동기 처리가 성공 시에 호출되며 reject는 실패 시 호출된다.

Promise는 status내에 진행 상태를 나타낸다.

프로미스의 상태정보	의미	상태변경조건
pending	비동기 처리가 아직 실행되지 않은 상태	프로미스가 생성된 직후 기본 상태
fulfilled	비동기 처리가 수행된 상태(resolve)	resolve상태
rejected	비동기 처리가 실패한 상태(reject)	reject 상태

Promise는 비동기 처리의 상태와 결과를 관리하는 객체이다.

Promise.all

여러개의 비동기 처리를 병렬처리할 때 사용하는 정적 메서드로 모든 프로미스가 fulfilled 상태가 되면 resolve한 순서대로 배열에 저장(처리 순서를 보장한다.)하여 새로운 프로미스를 반환하며 프로미스 중 하나라도 rejected가 된다면 즉시 종료한다.

async/await

async

async 키워드를 사용하여 생성하며 await함수는 async 내에서만 사용 가능하다. async함수가 프로미스를 반환하도록 명시되어 있지 않아도 암묵적으로 반환값을 resolve하는 promise를 번환한다.
클래스의 constructor메소드는 인스턴스를 반환해야하기 때문에 async메소드가 될 수 없다.

await

await 키워드는 반드시 promise앞에 사용해야 하며 promise가 settled상태(비동기가 실행된 상태)가 되는 시점에 resolve한 결과를 반환한다.