(ES6+) Generator, Iterator

최은지·2022년 4월 4일
0
post-thumbnail

코드 스피츠 영상을 보고 있었는데, Generator에 대한 내용이 조금 생소해서 적어본다.

우리의 MDN에는 이렇게 적혀있다. Redux-saga에서 generator를 사용하는 것으로 알고있는데, 정리해보려 한다.

우선, Generator.

  • Generator 함수를 호출하면 Iterator가 나온다.
  • return은 없음.
  • yield로 지연 실행.
const N2 = class{
	constructor(max){
    	this.max = max;
    }
  // Symbol.iterator 메소드는 next 메소드를 소유한 이터레이터를 반환해야 한다.
  // next 메소드는 이터레이터 리절트 객체를 반환
    [Symbol.iterator](){
    	let cursor = 0, max = this.max;
        return {
        	done: false,
            next(){
            	if(cursor > max){
                	this.done = true;
                }else{
                	this.value = cursor * cursor;
                    cursor++;
                }
                return this;
            }
        }
    }
}
const generator = function*(max){
	let cursor = 0;
    while(cursor < max){
    	yield cursor * cursor;
        cursor++;
    }
}
  • 위의 코드의 next()는 generator의 yield에 해당한다.

..조금 더 이해할 필요가 있다.

  • 위에서 Generator 함수를 호출하면 Iterator가 나온다. 라는 말을 언급했었다.
  • Generator를 이용하면 iterator를 쉽게 구현가능하다.

Iterator 와 Iterable이란?

  • Iterable : 객체의 멤버를 반복할 수 있는 객체이다.
    • Js에서 객체가 iterable 하기 위해서는, object에 @@iterator가 구현되어 있어야 한다.
    • object property에 Symbol.iterator를 추가해야한다.
    • obj[Symbol.iterator]
  • Iterator : next 메서드로 순환할 수 있는 객체
    • next 메서드가 값을 반복하면서, {done, value}를 반환한다.

출처 - https://pks2974.medium.com/javascript%EC%99%80-iterator-cdee90b11c0f

Symbol이란?

  • 객체가 아닌 변경 불가능한 원시 타입의 값
  • 프로그램이 이름 충돌의 위험 없이 프로퍼티의 키로 쓰기 위해 생성하고 사용할 수 있는 값

왜 필요할까..?

  • 이터레이션 프로토콜은 다양한 데이터 소스가 하나의 순회 방식을 갖도록 규정하여 데이터 소비자가 효율적으로 다양한 데이터 소스를 사용할 수 있도록 데이터 소비자와 데이터 소스를 연결하는 인터페이스 역할을 한다.
  • 데이터 소비자는 이터레이션 프로토콜만을 지원하도록 구현하면 된다

reference

https://poiemaweb.com/es6-iteration-for-of#4-%EC%9D%B4%ED%84%B0%EB%A0%88%EC%9D%B4%EC%85%98-%ED%94%84%EB%A1%9C%ED%86%A0%EC%BD%9C%EC%9D%98-%ED%95%84%EC%9A%94%EC%84%B1
https://pks2974.medium.com/javascript%EC%99%80-iterator-cdee90b11c0f
https://www.youtube.com/watch?v=GhAkc00TvZs&list=PLBA53uNlbf-tKPtxR85LmXFYk0pNF8-Og&index=4
https://tenor.com/view/chunsik-gif-24776998

profile
배고파

0개의 댓글