제너레이터 함수

2022. 2. 6. 16:16·JS

일반적으로 자바스크립트 함수는 실행하면 

함수 내부의 로직들이 순차적으로 작동하게 된다.

 

제너레이터 함수는 기본 함수에서 일시정지 같은 기능을 탑재하고 있다.

function* generator(i) {
yield i;
yield i + 10;
}

const gen = generator(10);

console.log(gen.next());
// expected output: 10

console.log(gen.next());
// expected output: 20

gen 이라는 상수는 generator 함수에 10이라는 인자 값을 전달해서 함수를 실행한다.

일반적인 함수의 관점에서 내부가 10 과 20이 된다는 것을 유추 할 수가 있다.

 

그렇지만 내부에서 한번에 10과 20이 나오지 않는다.

 

gen.next()를 한번 실행하면 다음 yield까지 로직이 실행된다. 그래서 콘솔에 10이 나온다.

 

그 다음 로직의 결과를 보고 싶다면 gen.next()를 한번 더 실행하면  20이 된다.

 

결과적으로 yield가 로직의 시작과 종료점이 된다. 그리고 일시정지 같은 기능을 제공하게 된다.

 

 

이 같은 제너레이터 함수의 특성을 이용한 대표적인 라이브러리가 있는데

Redux middleware library인 redux-saga 가 있다.

 

 

'JS' 카테고리의 다른 글

리스트 드래그 앤 드랍 구현 (자바스크립트, 엘리먼트로 제어)  (0) 2023.04.29
드래그 이벤트 - 자바스크립트  (0) 2023.04.29
default parameter (매개변수 기본값)  (0) 2020.07.21
ES6 - template literal  (0) 2020.07.21
ES6 - Block scope  (0) 2020.06.21
'JS' 카테고리의 다른 글
  • 리스트 드래그 앤 드랍 구현 (자바스크립트, 엘리먼트로 제어)
  • 드래그 이벤트 - 자바스크립트
  • default parameter (매개변수 기본값)
  • ES6 - template literal
king_hd
king_hd
웹 개발 공부를 위한 블로그입니다.
king_hd
웹 개발 기록
king_hd
전체
오늘
어제
  • 분류 전체보기
    • HTML
    • CSS
    • JS
    • Typescript
    • React
    • nodejs
    • Redux
    • Git
    • 오류모음
    • Webpack
    • 자료구조
    • 네트워크
    • Electron
    • 배포
    • Docker
    • 프로그래머스

블로그 메뉴

  • 홈

링크

공지사항

인기 글

태그

리덕스
프론트엔드
인증서 자동갱신
4차산업혁명동아리
Redux
let
리덕스사가
프로그래머스
https 인증서 발급
TAVE
propertykey
Redux-saga
코딩테스트
웹퍼블리셔
Hook
docker
TypeScript
JavaScript
타입스크립트
webpack
react
자바스크립트
docker mysql workbench 연동하는 법
const
mysqld: can't open file: 'mysql.ibd' (errno: 0 - )
next.js
env파일 환경변수 인식
ec2에 docker 설치
백엔드
웹개발

최근 댓글

최근 글

hELLO· Designed By정상우.v4.6.0
king_hd
제너레이터 함수
상단으로

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.