SlideShare a Scribd company logo
Generator
실제 사용 사례
를 발표하려고 하였으
나..
Generator 발표자료
Generator의 핵심
JS에서 흐름제어를 제어하기 위한
도구
흐름제어가 무엇이냐?
• 폰 노이만 구조의 컴퓨터 환경에서는 CPU에 명령이 적재되고 적
재된 명령을 실행하는 flow 상태를 가집니다. 동기 명령이 일어나
는 것을 루틴이라고 합니다.
• 자바스크립트는 함수단위의 코드는 완전실행되는 루틴을 가지고
있었다.
• 함수 안에 반복 횟수가 많은 반복문이 존재하는 경우 반복문의 실
행때문에 CPU 자원이 묶여 버려서 다른 기능을 수행하지 못한다.
- (블록킹 현상)
• 최근에는 OS가 강력한 권한을 가지고 있어서 소프트웨어가 반복
문에 의해 머신자원을 독점하는 현상을 방지한다.
• 예) 데스크탑 브라우저의 블록킹 허용시간은 20초, 안드로이드의
경우 5초
예제
• Canvas에서 그레이
스케일 처리
• 이미지의 크기가 크면
클 수록 작은 단위로 분리해서
반복문을 처리해야 한다.
제너레이터의 기초
• iterable의 인터페이스
• 더 높은 추상화
• 복잡한 루프의 추상화
iterable의 인터페이스
• iterable이란 Symbol.iterator와 next메소드를 구현한 객체.
• 이 객체는 next 메소드를 호출할 수 있고, next 메소드는
{ value: 값, done: 불린 } 형태의 값을 반환한다.
예 제
• 제너레이터 자체는 이터레이터를 쉽게 만들기 위해 사용하
는 도구
더 높은 추상화
• ES6에서는 generator구문에 iterator를 한 단계 더 추상화하
여 위임할 수 있는 yield* 구문을 지원.
• yield를 반환하는 generator에게 다시 본인의 yield를 위임.
• iterator라는 인터페이스를 지키는 모든 객체는 스스로 알아
서
반복될 로직을 소유하므로 이 객체들을 조합하고 위임하여
객체를 사용하는 곳에서는 그저 실행만 하면 되는 높은 추
상화를
가질 수 있다.
복잡한 루프의 추상화
• Element를 순회하는 루프가 있다고 하자.
만약 여기서 반복문의 구조가 확장되어야 한다면?
제너레이터를 이용하여 반복문만을 분리하여 코드를 확장 할 수 있다.
Generator 발표자료
비동기에서 제너레이터
• 특정 함수 f를 n번 실행시켜주는 함수 slicer
• 만약 setTimeout 말고 다른 비동기적 함수를 사용해야 한다
면?
실행기(executor)
• 제너레이터를 이용하면 제어구조를
그대로 둔 상태에서 변경되는 코드만
외부에 둘 수 있다.
• 이렇게 외부에서 제너레이터의
제어구조를 이용하는 쪽을 실행기
(executor)라고 부른다.
• slicer의 핵심 제어는 제너레이터에게
위임되어있으므로 실행기의 비동기
로직만을 따로 관리할 수 있어
역할 분리가 잘되어 있는 것을 볼 수 있다.
• 제너레이터의 비동기 사용이란 결국 실행기와
제너레이터를 이용하여 적절한 시점에 이터레이션
을 진행시키는 기법이라고 할 수 있다.
제너레이터가 직접 이터레이션을 통
제하기
• 앞에서 살펴본 실행기의 아이디어는 단지 역할을 분리하기
위해서만 사용되는 것은 아니다.
• 실행기가 제너레이터에게 실행기의 진행을 위임할 수 있는
방법을 넘겨주게 되면 제너레이터가 흐름제어에 관여하는
방식이 달라진다.
• 더 이상 실행기 쪽에서
제너레이터의 이터레이션을
진행하지 않는다.
• 제너레이터는 next를 받아
더 이상 실행기와 상호작용
하지 않고 스스로 이터레이션
을 진행한다.
제이쿼리 AJAX 통신 예
제
fetch와 프라미스로 확장
• 이번 예제에서는 이터레이션의 통제를 실행기 쪽에서 가졌
다.
• 제네레이터 내부 로직을 더욱 간소화하고 fetch의 결과인
프라미스만 넘겨주기 위해서다.
• 실행기와 제네레이터 중 누가 주도적으로 이터레이션을 진
행
시킬 것인가는 경우에 따라 선택해야한다.
• next함수의 마지막 처리에 next를 불러 이터레이션을 주입
하여
결과적으로 실행기가 제네레이터의 다단계 프라미스를 처
리한다.
async await로 전환
• async-await는 결국 프라미스 비동기 실행기를 내장한 제네
레이터 구문이라 할 수 있다.
• await는 결국 then에 대한 실행기이므로 한번 then이 겹칠
때마다 await를 해줘야한다.
async generator로 확장
• 프라미스를 사용한 비동기 실행기와 제너레이터의 사용을
간단히 async-await로 처리하였지만
• async-await는 중간에 yield를 할 수 없기 때문에 1회성
then을 처리하여 이터레이션을 자동화 해준 실행기 정도의
의미를 갖는다.
• 일종의 매크로 구문이나 마찬가지인데 이것의 대가로 원래
제네레이터의 가치인 코루틴으로서의 기능을 잃어버리게
되었다.
• 이걸 해결하기 위해 아직 표준은 아니지만 Asynchronous
Iteration이라는 stage3까지 올라온 제안이 있다.

More Related Content

PPTX
리플렉션과 가비지 컬렉션
QooJuice
 
PDF
20 handler and_async_task
운용 최
 
PDF
Direct x 12 초기화
QooJuice
 
PPTX
Go revel 구성_루팅_정리
라한사 아
 
PDF
Game programming patterns
QooJuice
 
PDF
Game programming patterns 2
QooJuice
 
PPTX
윈도우 커널모드에서의 스레드동기화
Dong-Jin Park
 
PDF
게임서버프로그래밍 #3 - 메모리 및 오브젝트 풀링
Seungmo Koo
 
리플렉션과 가비지 컬렉션
QooJuice
 
20 handler and_async_task
운용 최
 
Direct x 12 초기화
QooJuice
 
Go revel 구성_루팅_정리
라한사 아
 
Game programming patterns
QooJuice
 
Game programming patterns 2
QooJuice
 
윈도우 커널모드에서의 스레드동기화
Dong-Jin Park
 
게임서버프로그래밍 #3 - 메모리 및 오브젝트 풀링
Seungmo Koo
 

What's hot (8)

PDF
UE4 Garbage Collection
QooJuice
 
PDF
게임서버프로그래밍 #4 - 멀티스레드 프로그래밍
Seungmo Koo
 
PPTX
정적분석
Yousung Kim
 
PPTX
[Gpg1권 박민근] 1.0 1.4 요약 정리
MinGeun Park
 
PDF
Golang 개발 환경(profile) 다르게 잡아주기
라한사 아
 
PDF
[NHN NEXT]실전프로젝트 밴드 게임 만들기 후기
flashscope
 
PDF
게임서버프로그래밍 #6 - 예외처리 및 로깅
Seungmo Koo
 
PDF
리눅스 환경에서 SonarQube 간단하게 사용해보기
flashscope
 
UE4 Garbage Collection
QooJuice
 
게임서버프로그래밍 #4 - 멀티스레드 프로그래밍
Seungmo Koo
 
정적분석
Yousung Kim
 
[Gpg1권 박민근] 1.0 1.4 요약 정리
MinGeun Park
 
Golang 개발 환경(profile) 다르게 잡아주기
라한사 아
 
[NHN NEXT]실전프로젝트 밴드 게임 만들기 후기
flashscope
 
게임서버프로그래밍 #6 - 예외처리 및 로깅
Seungmo Koo
 
리눅스 환경에서 SonarQube 간단하게 사용해보기
flashscope
 
Ad

Similar to Generator 발표자료 (8)

PDF
Command processor
DaeMyung Kang
 
PPTX
Effective c++ chapter 7,8
문익 장
 
PPTX
Free rtos seminar
Cho Daniel
 
PPTX
Linux reversing study_basic_4
J J
 
PPT
Component configurator
scor7910
 
PDF
Uml intro 0
운용 최
 
PPTX
KGC 2014: 분산 게임 서버 구조론
Hyunjik Bae
 
PPT
Web Application Testing Patterns
June Kim
 
Command processor
DaeMyung Kang
 
Effective c++ chapter 7,8
문익 장
 
Free rtos seminar
Cho Daniel
 
Linux reversing study_basic_4
J J
 
Component configurator
scor7910
 
Uml intro 0
운용 최
 
KGC 2014: 분산 게임 서버 구조론
Hyunjik Bae
 
Web Application Testing Patterns
June Kim
 
Ad

Generator 발표자료

  • 1. Generator 실제 사용 사례 를 발표하려고 하였으 나..
  • 3. Generator의 핵심 JS에서 흐름제어를 제어하기 위한 도구
  • 4. 흐름제어가 무엇이냐? • 폰 노이만 구조의 컴퓨터 환경에서는 CPU에 명령이 적재되고 적 재된 명령을 실행하는 flow 상태를 가집니다. 동기 명령이 일어나 는 것을 루틴이라고 합니다. • 자바스크립트는 함수단위의 코드는 완전실행되는 루틴을 가지고 있었다. • 함수 안에 반복 횟수가 많은 반복문이 존재하는 경우 반복문의 실 행때문에 CPU 자원이 묶여 버려서 다른 기능을 수행하지 못한다. - (블록킹 현상) • 최근에는 OS가 강력한 권한을 가지고 있어서 소프트웨어가 반복 문에 의해 머신자원을 독점하는 현상을 방지한다. • 예) 데스크탑 브라우저의 블록킹 허용시간은 20초, 안드로이드의 경우 5초
  • 5. 예제 • Canvas에서 그레이 스케일 처리 • 이미지의 크기가 크면 클 수록 작은 단위로 분리해서 반복문을 처리해야 한다.
  • 6. 제너레이터의 기초 • iterable의 인터페이스 • 더 높은 추상화 • 복잡한 루프의 추상화
  • 7. iterable의 인터페이스 • iterable이란 Symbol.iterator와 next메소드를 구현한 객체. • 이 객체는 next 메소드를 호출할 수 있고, next 메소드는 { value: 값, done: 불린 } 형태의 값을 반환한다.
  • 8. 예 제 • 제너레이터 자체는 이터레이터를 쉽게 만들기 위해 사용하 는 도구
  • 9. 더 높은 추상화 • ES6에서는 generator구문에 iterator를 한 단계 더 추상화하 여 위임할 수 있는 yield* 구문을 지원. • yield를 반환하는 generator에게 다시 본인의 yield를 위임. • iterator라는 인터페이스를 지키는 모든 객체는 스스로 알아 서 반복될 로직을 소유하므로 이 객체들을 조합하고 위임하여 객체를 사용하는 곳에서는 그저 실행만 하면 되는 높은 추 상화를 가질 수 있다.
  • 10. 복잡한 루프의 추상화 • Element를 순회하는 루프가 있다고 하자. 만약 여기서 반복문의 구조가 확장되어야 한다면?
  • 11. 제너레이터를 이용하여 반복문만을 분리하여 코드를 확장 할 수 있다.
  • 13. 비동기에서 제너레이터 • 특정 함수 f를 n번 실행시켜주는 함수 slicer • 만약 setTimeout 말고 다른 비동기적 함수를 사용해야 한다 면?
  • 14. 실행기(executor) • 제너레이터를 이용하면 제어구조를 그대로 둔 상태에서 변경되는 코드만 외부에 둘 수 있다. • 이렇게 외부에서 제너레이터의 제어구조를 이용하는 쪽을 실행기 (executor)라고 부른다. • slicer의 핵심 제어는 제너레이터에게 위임되어있으므로 실행기의 비동기 로직만을 따로 관리할 수 있어 역할 분리가 잘되어 있는 것을 볼 수 있다. • 제너레이터의 비동기 사용이란 결국 실행기와 제너레이터를 이용하여 적절한 시점에 이터레이션 을 진행시키는 기법이라고 할 수 있다.
  • 15. 제너레이터가 직접 이터레이션을 통 제하기 • 앞에서 살펴본 실행기의 아이디어는 단지 역할을 분리하기 위해서만 사용되는 것은 아니다. • 실행기가 제너레이터에게 실행기의 진행을 위임할 수 있는 방법을 넘겨주게 되면 제너레이터가 흐름제어에 관여하는 방식이 달라진다.
  • 16. • 더 이상 실행기 쪽에서 제너레이터의 이터레이션을 진행하지 않는다. • 제너레이터는 next를 받아 더 이상 실행기와 상호작용 하지 않고 스스로 이터레이션 을 진행한다.
  • 19. • 이번 예제에서는 이터레이션의 통제를 실행기 쪽에서 가졌 다. • 제네레이터 내부 로직을 더욱 간소화하고 fetch의 결과인 프라미스만 넘겨주기 위해서다. • 실행기와 제네레이터 중 누가 주도적으로 이터레이션을 진 행 시킬 것인가는 경우에 따라 선택해야한다. • next함수의 마지막 처리에 next를 불러 이터레이션을 주입 하여 결과적으로 실행기가 제네레이터의 다단계 프라미스를 처 리한다.
  • 20. async await로 전환 • async-await는 결국 프라미스 비동기 실행기를 내장한 제네 레이터 구문이라 할 수 있다. • await는 결국 then에 대한 실행기이므로 한번 then이 겹칠 때마다 await를 해줘야한다.
  • 21. async generator로 확장 • 프라미스를 사용한 비동기 실행기와 제너레이터의 사용을 간단히 async-await로 처리하였지만 • async-await는 중간에 yield를 할 수 없기 때문에 1회성 then을 처리하여 이터레이션을 자동화 해준 실행기 정도의 의미를 갖는다. • 일종의 매크로 구문이나 마찬가지인데 이것의 대가로 원래 제네레이터의 가치인 코루틴으로서의 기능을 잃어버리게 되었다. • 이걸 해결하기 위해 아직 표준은 아니지만 Asynchronous Iteration이라는 stage3까지 올라온 제안이 있다.