티스토리 뷰
46.1 제너레이터란?
- es6(2015)에서 도입된 generator는 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할때 사용하는 api다.
- 특징:
-- 제너레이터 함수는 caller 함수에게 제어권을 양도할 수 있다.
-- 함수 caller함수와 함수 상태를 주고받을 수 있다.
-- 제너레이터함수는 제너레이터 객체를 반환한다.
- 제너레이터 함수는 function* 키워드로 *getName() 이런식으로 선언한다. 그리고 내부에 yield를 한 라인 이상 작성한다.
46.2 제너레이터 객체
- 제너레이터 함수를 호출하면 제너레이터 객체를 생성해 반환한다. 해당 객체는 iterable이면서 iterator다.
- Symbol.iterator 메서드를 상속받는 iterable이라서 value, done 프로퍼티를 가지며, 이터레이터의 result 객체를 반환하는 next매서드를 소유한다. 별도로 iterator를 생성할 필요가 없다.
46.3 제너레이터의 일시중지와 재개
- yield 키워드와 next메서드를 통해 실행을 일시 중지했다가 재개한다.
- yield 표현식이 있는 데까지만 실행하고 다음 yield표현식이 있는데 까지 next 메서드가 호출됐을 때 실행한다.
- yield를 만나면 제너레이터 객체안의 value에 yield키워드가 쓰여진 라인의 값을 할당한다. done은 앞에 남아있는 yield가 있는지 판단할 때 사용하면 된다.
- yield를 만났을 때 함수의 호출제어권이 caller에게 양도된다. 왜냐하면 caller가 next를 써줘야 다음으로 넘어갈 수 있기 때문이다.
- caller는 yield로 generator 함수의 상태를 중간에 받을 수도 있고, next매서드에 parameter를 전달해서 중간에 값을 밀어넣을 수 도 있다. 이렇게 비동기 처리를 동기 처리처럼 구현을 할 수 있는 것이다.
46.4 제너레이터의 활용
- 제너레이터 함수를 사용하면 이터레이션 프로토콜을 중시하기 때문에 간단하게 이터러블을 구현할 수 있다. ex) 피보나치
46.5 비동기 처리
- 제너레이터 함수는 next와 yield 표현식을 사용하여 호출자와 함수 상태를 주고받을 수 있기 때문에, 이러한 처리를 promise함수와 결합하면 then/catch/finally 없이 promise의 비동기 처리를 구현할 수 있다.
- async await의 await 키워드를 비동기 처리가 필요한 것에 넣는 것 처럼 yield에 넣어줄 수 있다. 다만, 별로 추천하지 않는다. 굳이 쓰고 싶다면 co라이브러리를 사용해라.
46.6.1 async/await
- 제너레이터를 사용하면 코드가 매우 장황하고 가독성이 안좋아진다. 그래서 ES8(2017)에서 async/await를 도입했다.
- async/await는 프로미스를 기반으로 동작하고 비동기 후속처리를 동기처리하는 문법처럼 작성할 수 있다.
- await 키워드는 반드시 async 내에서만 작성해야하고, async함수는 반드시 promise를 반환한다.
- 클래스의 constructor메서드는 항상 인스턴스를 반환해야 하기 때문에, async 메서드가 될 수 없다.
** 모든 promsie에서 await를 사용하면 안된다. 처리 결과를 이어서 해야할게 아니면 비동기적을 처리하는게 성능상 더 좋기 때문이다.
46.6.2 await 키워드
- await 키워드는 settled 상태가 되면 promise가 resolve 한 결과를 반환한다. await는 항상 promise 앞에서 사용해야 한다.
46.6.3 에러처리
- 콜백 패턴은 에러처리가 곤란하다. 비동기 함수를 호출한게 비동기 함수가 아니기 때문에 에러를 캐치할 수 있다..?
- async함수 내에서 catch문으로 에러처리하지않으면 reject하는 promise를 반환한다. 따라서, catch문으로도 에러처리할 수 있다.(try catch 말고 promise의 catch)
궁금한 점
- 자바스크립트의 iterator와 iterable 객체에 대해서 이해해봐야할 듯. c++이랑 java에도 있는데, 자바스크립트에선 어떤지?