Upgrade to Pro — share decks privately, control downloads, hide ads and more …

JavaScript에서의 비동기 반복기

Jin
July 26, 2018

JavaScript에서의 비동기 반복기

Jin

July 26, 2018
Tweet

More Decks by Jin

Other Decks in Programming

Transcript

  1. 발표자 소개 박서진 Suhjin Park Ø Viva Republica (Toss) Ø

    JavaScript, Scala Ø 표현적인 언어, 함수형 프로그래밍 Ø 디자인, 수학, 외국어 raon0211 [email protected] https://suhj.in 2 JavaScript에서의비동기반복기
  2. 동기 작업으로 처리해서는 안 되는 것 5 JavaScript에서의비동기반복기 Ø 병행

    처리 (Concurrency) Ø DB 읽기/쓰기, 파일 읽기/쓰기와 같은 무거운 작업 Ø 웹 프론트엔드 애플리케이션에서 무거운 작업 수행
  3. 비동기 작업 6 JavaScript에서의비동기반복기 Ø 사용자 JavaScript 코드는 싱글 스레드

    Ø 무거운 작업을 순차적으로 작업 큐(Queue)에 삽입 Ø 작업이 완료되면 콜백 함수(완료 핸들러)가 실행 Ø setTimeout
  4. 손쉽게 구현하는 비동기 작업 7 JavaScript에서의비동기반복기 3,000+개 객체의 검색을 수행하여야

    한다. Ø 무거운 작업을 1개의 검색으로 쪼갬 Ø 첫 번째 검색을 작업 큐에 넣음 Ø 하나의 객체에 대해 검색이 완료되면, 다음 객체의 검색을 작업 큐에 넣음 Ø 모든 객체의 검색이 완료되면 결괏값과 함께 콜백 함수를 실행 Ø 하나의 검색 사이사이에 다른 작업을 수행할 수 있음. PROFIT!
  5. Promise 9 JavaScript에서의비동기반복기 Ø 비동기와 병행 처리를 위해 특화된 JavaScript의

    일부분 Ø 값과 상태를 가지고 있음 Ø 비동기적으로 처리되는 값에 접근하는 방법 Ø 아무 의식 없이 사용하는 “모나드”: 작업을 우아하게 연쇄 처리할 수 있음 Ø 함수가 아니라 값 (*틀림: 10개의 Promise를 실행해라)
  6. Promise의 상태 10 JavaScript에서의비동기반복기 Ø 작업 중(Pending), 완료(Fulfilled), 실패(Rejected/Cancelled) Ø

    Promise가 완료되거나 실패하면 다시는 상태가 변경되지 않음 Ø 각종 런타임 오류에 대해 안전해짐 Ø Callback을 받는 함수를 손쉽게 Promise를 반환하는 함수로 변경 가능 Ø Native Promise, Bluebird
  7. JavaScript에서의비동기반복기 async/await 13 Ø ECMAScript의 새 키워드 Ø Promise 체이닝을

    더 읽기 쉽게 만들어 줌, Syntactic Sugar Ø C#, F#, Dart, Python… Ø 여전히 비동기이고 이벤트가 바탕
  8. JavaScript에서의비동기반복기 반복기(Iterator) 15 Ø for … of 루프의 핵심 Ø

    next(value) 메서드가 { value: any; done: boolean; }을 반환하면 반복기 Ø 한 번에 하나씩, 무한 길이도 가능 Ø ECMAScript 6의 function*