Web Front-end/함수형 프로그래밍(FP)

[JS/함수형] 제너레이터와 이터레이터

Generator

- 제너레이터 : Well-formed Iterator를 반환해주는 함수, Iterator를 생성하는 함수.  제너레이터 또한, 이터레이터이자 이터러블이다.

- 제너레이터는, 특정 조건/로직을 추가할 수 있고, Generator 자체도 , 이터레이터이자 이터러블이기 때문에, for ..of문의 대상이 될 수 있다.

fucntion *gen() {
	//Genetor 내부에서, 순회할 문장(context)를 만들어낸다.
	yield 1;
    if (false) yield 2; // 2제외 
    yield 3;
    yield 4;
}
// JS에서는 Gen를 이용하면 어떠한 값이든, 어떠한 상태든 순회할 수 있는 형태로 만들 수 있게 된다.


let iter = gen();
console.log(iter[Symbol.iterator]() === iter)
//true

console.log(iter.next())
//1 , false 
console.log(iter.next())
//2 , false
console.log(iter.next())
//3 , false
console.log(iter.next())
//4 , false
console.log(iter.next())
//5 , true

for (const a of gen()) console.log(a);

이제, 짝수를 Filtering하는 함수형 프로그램을 짜봅시다!

 

Step 1. for문을 이용하여, 평상시 처럼 구현하기.

See the Pen Example_odd_step1 by Doge (@DogeIsFree) on CodePen.

Step 2.  infinity generator를 이용하여, for of 식으로 나타내주기.

 

See the Pen Example_even_step2 by Doge (@DogeIsFree) on CodePen.

 

 

Step 3. Limit generator를 이용하여, Limit도 함수형으로 표현해보기 , 전개연산자와 구조분해할당 이용해보기

See the Pen Example_Step_3 by Doge (@DogeIsFree) on CodePen.

 

 

* Ref

위 내용은, 유인동님의 함수형 프로그래밍과 JS ES6를 기반으로 제가 듣고 정리한 내용입니다. 

https://www.inflearn.com/course/functional-es6

 

함수형 프로그래밍과 JavaScript ES6+ - 인프런 | 강의

ES6+와 함수형 프로그래밍을 배울 수 있는 강의입니다. 이 강좌에서는 ES6+의 이터러블/이터레이터/제너레이터 프로토콜을 상세히 다루고 응용합니다. 이터러블을 기반으로한 함수형 프로그래밍,

www.inflearn.com