[모던JS입문] 이터레이터 제너레이터

Bora Im·2020년 4월 12일
0

모던JS입문

목록 보기
5/8

8.11.3 이터레이터와 for/of문
이터레이션 (iteration, 반복처리)
: 데이터 안의 요소를 반복적으로 꺼내는 행위

이터레이터 (iterator, 반복기)
: 이터레이션(반복처리)이 가능한 객체

  • next 메서드를 가진다.
  • next 메서드의 반환값 이터레이터 리절트

배열의 메서드 Symbol.iterator (@@iterator, 이터레이터 심벌)
: 자바스크립트에 내장되어 있는 특별한 의미를 가진 심벌(내장 심벌)
: 이터레이터 객체를 반환하는 함수

var a = [5,4,3];
var iter = a[Symbol.iterator](); // 이터레이터를 반환
console.log(iter.next()); // Object {value:5, done:false}
console.log(iter.next()); // Object {value:4, done:false}
console.log(iter.next()); // Object {value:3, done:false}
console.log(iter.next()); // Object {value:undefined, done:true}

iter의 next 메서드를 호출할 때마다 반환되는 이터레이터 리절트 (iterator result)
: value 와 done 프로퍼티를 갖는 객체
value <- 차례대로 꺼내진 배열 요소의 값
done <- 요소의 열거가 끝났는지를 뜻하는 논리값

이터레이터를 사용해 이터레이션을 하려면 개발자의 처리가 필요
for/of문을 사용해 반복처리를 자동으로 간결하게!

var a = [5,4,3];
for(var v of a) console.log(v); // 5 4 3

for/of문은 이터레이터의 next 메서드를 순회할 때마다 매번 호출,
이터레이터 리절트의 done 프로퍼티 값이 false가 아닌 동안에 계속 실행.

for/of문이 반복처리할수있는 객체 : 반복 가능(iterable)한 객체

  • Symbol.iterator 메서드를 가진다.
  • Symbol.iterator 메서드의 반환값은 이터레이터
  • Array, String, TypedArray, Map, Set
  • for/of문, 전개연산자 yield*, 비구조화 할당 등에 활용

반복 가능한 내장객체의 이터레이터는 for/of문으로 반복처리할수 있다.

var a = [5,4,3];
var iter = a[Symbol.iterator]();
for(var v of iter) console.log(v); // 5 4 3

8.11.4 제너레이터 (generator)

  • 반복가능한 이터레이터를 값으로 반환
  • 작업의 일시정지와 재시작이 가능하며 자신의 상태를 관리
  • function* 문으로 정의한 함수, 하나 이상의 yield 표현식을 포함
function* gen() {
  yield 5;
  yield 4;
  yield 3;
}
var iter = gen(); // 이터레이터를 반환
console.log(iter); // Generator Function Prototype
console.log(iter.next()); // Object {value:5, done:false}
console.log(iter.next()); // Object {value:4, done:false}
console.log(iter.next()); // Object {value:3, done:false}
console.log(iter.next()); // Object {value:undefined, done:true}
  • 제너레이터 함수의 yield : 프로그램이 일시적으로 정지하는 위치
  • 제너레이터로 생성한 이터레이션의 next 메서드 : 제너레이터 함수의 상태를 일시정지에서 실행으로 바꾸는 역할
  • 이터레이터 객체는 제너레이터 함수의 내부상태를 모두 저장

제너레이터에 값 넘기기 : next(값)
제너레이터 종료하기 : return 메서드
제너레이터에 예외 던지기 : throw 메서드
반복 가능한 객체에 위임하기 : yield* (반복가능한 객체를 지정)

8.11.5 템플릿 리터럴의 태그 함수
태그가 지정된 템플릿 리터럴 (tagged template literal)
템플릿 리터럴 앞에 함수이름을 붙이면 템플릿 리터럴의 내용을 인수로 받는 함수를 호출

func`${a} + ${b} = ${a+b}`

func 태그 함수 (tag function)

function list() { return arguments; }
var t = list`a${1}b${2}c${3}`;
console.log(t); // [["a","b","c",""],1,2,3]

태그함수의 첫번째 인수 : 템플릿 리터럴 안의 문자열을 ${ } 을 기준으로 분할한 문자열(a,b,c)을 요소로 담은 배열
두번째 이후 인수 : 각 ${ } 안의 표현식을 평가한 값이 순서대로
! 템플릿 리터럴의 시작이나 끝에 ${ } 이 있으면 첫번째인수배열의 처음 또는 마지막 요소로 빈 문자열

태그함수의 첫번째인수 : callSite 객체

  • 동결된 객체로 읽기만 가능
  • 이전에 처리했던 템플릿리터럴 문자열을 만나면 캐시된 객체를 넘긴다.
  • callSite 객체의 raw 프로퍼티로 이스케이프되지 않은 문자열

0개의 댓글