비동기

Callback, Promise 그리고 Generator

·2 min read

비동기에 대해서 설명해주실 수 있으실까요?

면접가서 비동기 질문을 받으면 대표적으로 할 수 있는 말은 Callback, Callback 지옥을 해결하기 위한 Promise Promise then 중첩을 해결하기 위한 async & await을 주로 이야기한다.

하지만 내가 모르는 다른 개념이 존재했는데 바로 Generator이다.

Generator는 ES6에서 도입되었고 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수이다.

function* generator() {
  yield 1
  yield 2
  yield 3
}

function에 *을 붙여서 사용하며, 일시중지가 필요한 시점마다 yield를 호출해 사용할 수 있다.

const iteration = generator()
console.log(iteration.next()) // {value:1, done:false}
console.log(iteration.next()) // {value:2, done:false}
console.log(iteration.next()) // {value:3, done:false}
console.log(iteration.next()) // {value:undefined, done:true}

함수에 접근해 이터레이션 프로토콜(next로 다음 단계를 호출하듯)을 이용해 실행을 제어할 수 있다.

이터레이션 프로토콜(iteration protocol)은 데이터 컬렉션을 순환하기 위한 프로토콜이다. 이터레이션 프로토콜에는 iterable(순환 가능한 자료구조)과 iterator(iterable의 요소를 탐색하기 위한 포인터)가 존재한다.

← Previous
React 라이브러리, Vue 프레임워크
Next →
화살표 함수와 일반 함수(function)의 차이