질문있습니다.

함수형 프로그래밍과 JavaScript ES6+

L.range, L.map, L.filter, take 의 평가 순서

작성

294

const Lazy = {
  *range(num) {
    for (let i = 0; i < num; i++) {
      yield i;
    }
  },
  *filter(predicate, iterable) {
    for (const value of iterable) {
      if (predicate(value)) { yield value; }
    }
  },
  *take(num, iterable) {
    let cnt = 0;

    for (const value of iterable) {
      cnt++;
      yield value;
      if (cnt >= num) { break; }
    }
  }
};

console.time('Lazy');
Array.from(Lazy.take(3, Lazy.filter(num => num % 2 === 0, Lazy.range(100000))));
console.timeEnd('Lazy');

이해가 한번에 잘 안되어 질문 남깁니다 :)

위 코드를 실행하면, 똑같이 지연평가를 수행하지만

영상과는 반대로 range -> filter -> take 순서로 실행합니다.

지연 평가가 연산의 역순이 핵심이 아니라, yield를 통한 각 요소마다의 다음 연산으로 제어권 위임이 핵심이 맞나요??

javascript 함수형 프로그래밍

답변 2

hhhh

질문자

이제 이해했습니다.

감사합니다.

유인동

지식공유자

작성하신 코드를 이렇게 실행하면 take, filter, range 순으로 실행되는 것을 볼 수 있습니다.

range가 연산을 미루고 이터레이터를 반환한 다음 그 이터레이터의 next를 filter에서 실행하도록 준비를한 이터레이터를 take가 받고, take 역시 연산을 미뤄둔 다음 그 값이 실제로 필요한 Array.from의 내부에서 이터레이터의 next를 처음 실행할 때까지 미뤄지는 컨셉, 지연평가라고 불려지고 있는 개념을 설명해드리고자 하는게 영상 내용의 핵심이고 제너레이터는 그것을 구현하는 하나의 방법입니다.

지연평가를 제너레이터로 구현했을 때 yield 가 핵심적인 역할을 하는 포인트라고 말할 수 있을 것 같습니다. 그러나 제너레이터와 이터레이터, 그리고 for...of와 이터러블 프로토콜이 모두 상호 동작하여 이루어지기 때문에 전체적인 동작과 컨셉이 모두 중요하다고 생각합니다.

이전 질문 주신 질문에 답변 드렸듯이 지연평가를 구현하기 위해서 제너레이터는 필수가 아니며 이터레이터만으로 만들 수 있습니다.

이터레이터만으로 만들고 이터레이터가 이터러블 프로토콜을 따르지 않게 만들 수도 있고, 개인적으로 또 다른 프로토콜을 만드는 것을 통해서도 구현할 수 있겠습니다만.

본 강의는 자바스크립트 언어(ES6+)의 많은 요소들과 함께 어우려져 동작하는 이터러블 프로토콜을 다루어 자바스크립트에서 잘 동작하고 어우러지는 함수형 프로그래밍을 전달하는 것이 강의의 목적입니다. (구조분해, 전개, for...of 등)

답변이 되셨길 바랍니다.

감사합니다.

인프런 커뮤니티 질문&답변

질문있습니다.