blair's 개발 portfolio

[모던 자바스크립트 Deep Dive] 46. 제너레이터와 async/await

46. 제너레이터와 async/await

 

46.1 제너레이터란?

  • 제너레이터는 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수다.

46.2 제너레이터 함수의 정의

  • 제너레이터 함수는 function* 키워드로 선언한다 그리고 하나 이상의 yield 표현식을 포함한다.이것을 제외하면 일반함수를 정의하는 방법은 다음과 같다
function* getDecFunc(){
    yield 1;
}
const getExpFunc = function* () {
    yield 1;
}

function* getDecFunc() {yield 1;}
function* getExpFunc() {yield 1;}
  • 화살표 함수로 정의할 수 없다.
  • new 연산자와 함께 생성자 함수로 호출할 수 없다.

46.3 제너레이터 객체

  • 제너레이터 함수를 호출하면 일반 함수처럼 함수 코드 블록을 실행하는 것이 아니라 제너레이터 객체를 생성해 반환한다.
  • 제너레이터 함수가 반환한 제너레이터 객체는 이터러블이면서 동시에 이터레이터다.
  • 제너레이터 객체는 next 메서드를 갖는 이터레이터지만 이터레이터에는 없는 return,throw 메서드를 갖는다.

46.4 제너레이터의 일시 중지와 재개

  • yield 키워드는 제너레이터 함수의 실행을 일시 중지 시키거나 키워드 뒤에 오는 표현식의 평가 결과를 제너레이터 함수 호출자에게 반환한다.
  • 제너레이터 객체 next 메서드를 호출하면 yield표햔식까지 실행되고 일시 중지 된다. 이때 함수의 제어권이 호출자로 양도 된다.
  • 제너레이터 객체의 next 메서드는 value, done 프로퍼티를 갖는 이터레이터 리절트 객체를 반환한다.
  • next 메서드가 반환한 이터레이터 리절트 객체의 value 프로퍼티에는 yield 표현식에서 yield된 값이 할당되고 done 프 로퍼티에는 제너레이터 함수가 끝까지 실행되었는지를 나타내는 불리언 값이 할당된다
  • 제너레이터 객체의 next 메서드에 전달한 인수는 제너레이터 함수의 yield 표현식을 할당받는 변수에 할당된다.

46.5 제너레이터의 활용

1. 이터러블의 구현

  • 제너레이터 함수를 사용하면 이터레이션 프로토콜을 준수해 이터러블을 생성하는 방식보다 간단히 이터러블을 구현할 수 있다.

2. 비동기 처리

  • 제너레이터 함수는 next 메서드와 yield 표현식을 통해 함수 호출자와 함수의 상태를 주고받을 수 있다.
  • 이러한 특성을 활용하면 프로미스를 사용한 비동기 처리를 동기처리처럼 구현할 수 있다.=> 프로미스의 후속 처리 메서드 then/catch/finally 없이 비동기 처리 결과를 반환하도록 구현할 수 있다.

46.6 asnyc/await

  • 제너레이터보다 간단하고 가독성 좋게 비동기 처리를 동기 처리처럼 동작하도록 구현할 수 있는 async/swait 가 도입되었다.
  • 후속 처리 메서드에 콜백 함수를 전달해서 비동기 처리 결과를 후속 처리할 필요 없이 마치 동기 처리처럼 프로미스를 사용할 수 있다.

1. async 함수

  • await 키워드는 반드시 async 함수 내부에서 사용해야 한다.
  • 언제나 프로미스를 반환
  • 명시적으로 프로미스를 반환하지 않아도 async 함수는 암묵적으로 반환값을 resolve하는 프로미스를 반환한다.

2. await 키워드

  • 프로미스가 settled 싱태가 될 때까지 대기하다가 settled  상태가 되면 프로미스가 resolve 한 처리 결과를 반환한다.
  • await 키워드는 반드시 프로미스 앞에서 사용해야한다.
  • await 키워드는 프로미스가 settled  상태가 될때까지 대기한다고 했다
  • 프로미스가  settled 상태가 되면 resolve한 처리 결과가 res 변수에 할당된다.

3. 에러처리

  • 비동기 처리를 위한 콜백 패터느이 단점 중 하나는 에러 처리가 곤란
  • async 함수 내에서 catch문을 사용해서 에러처리를 하지 않으면 async 함수는 발생한 에러를 reject하는 프로미스를 반환한다.

 

블로그의 정보

개발 블로그👩‍💻

Blairj

활동하기