alias:: Transducer: 강력한 함수 구성 패턴
노트북:: 변환기: 一种强大的函数组同模式
맵의 의미는 '매핑'입니다. 이는 세트의 모든 요소에 대해 한 번 변환을 수행한다는 의미입니다.
const list = [1, 2, 3, 4, 5] list.map(x => x + 1) // [ 2, 3, 4, 5, 6 ]
function map(f, xs) { const ret = [] for (let i = 0; i < xs.length; i++) { ret.push(f(xs[i])) } return ret }
map(x => x + 1, [1, 2, 3, 4, 5]) // [ 2, 3, 4, 5, 6 ]
위에서는 맵의 구현이 컬렉션 유형에 의존한다는 것을 명확하게 표현하기 위해 의도적으로 for 문을 사용했습니다.
순차적 실행;
게으르지 않고 즉각적인 평가.
필터를 살펴보겠습니다.
function filter(f, xs) { const ret = [] for (let i = 0; i < xs.length; i++) { if (f(xs[i])) { ret.push(xs[i]) } } return ret }
var range = n => [...Array(n).keys()]
filter(x => x % 2 === 1, range(10)) // [ 1, 3, 5, 7, 9 ]
마찬가지로 필터 구현도 특정 컬렉션 유형에 따라 달라지며 현재 구현에서는 xs가 배열이어야 합니다.
지도는 어떻게 다양한 데이터 유형을 지원할 수 있나요? 예를 들어 집합, 지도 및 맞춤 데이터 유형이 있습니다.
일반적인 방법이 있습니다. 컬렉션의 인터페이스(프로토콜)에 의존합니다.
언어마다 구현 방식이 다르며 JS는 이와 관련하여 기본 지원이 상대적으로 약하지만 실현 가능합니다.
Symbol.iterator를 사용하여 반복합니다.
생성자를 얻으려면 Object#contractor를 사용하세요.
그렇다면 푸시에서 다양한 데이터 유형을 추상적으로 지원하려면 어떻게 해야 할까요?
ramdajs 라이브러리를 모방하여 맞춤 @@transducer/step 함수를 사용할 수 있습니다.
function map(f, xs) { const ret = new xs.constructor() // 1. construction for (const x of xs) { // 2. iteration ret['@@transducer/step'](f(x)) // 3. collection } return ret }
Array.prototype['@@transducer/step'] = Array.prototype.push // [Function: push]
map(x => x + 1, [1, 2, 3, 4, 5]) // [ 2, 3, 4, 5, 6 ]
Set.prototype['@@transducer/step'] = Set.prototype.add // [Function: add]
map(x => x + 1, new Set([1, 2, 3, 4, 5])) // Set (5) {2, 3, 4, 5, 6}
이 방법을 사용하면 지도, 필터 등 보다 축적인 기능을 구현할 수 있습니다.
핵심은 생성, 반복, 컬렉션과 같은 작업을 특정 컬렉션 클래스에 위임하는 것입니다. 왜냐하면 컬렉션 자체만이 이러한 작업을 완료하는 방법을 알고 있기 때문입니다.
function filter(f, xs) { const ret = new xs.constructor() for (const x of xs) { if (f(x)) { ret['@@transducer/step'](x) } } return ret }
filter(x => x % 2 === 1, range(10)) // [ 1, 3, 5, 7, 9 ]
filter(x => x > 3, new Set(range(10))) // Set (6) {4, 5, 6, 7, 8, 9}
위의 맵과 필터를 함께 사용하면 몇 가지 문제가 발생할 수 있습니다.
range(10) .map(x => x + 1) .filter(x => x % 2 === 1) .slice(0, 3) // [ 1, 3, 5 ]
5개의 요소만 사용되지만 컬렉션의 모든 요소가 순회됩니다.
각 단계에서는 중간 컬렉션 개체가 생성됩니다.
우리는 Compose를 사용하여 이 로직을 다시 구현합니다
function compose(...fns) { return fns.reduceRight((acc, fn) => x => fn(acc(x)), x => x) }
합성을 지원하기 위해 맵, 필터 등의 기능을 카레 형태로 구현합니다.
function curry(f) { return (...args) => data => f(...args, data) }
var rmap = curry(map) var rfilter = curry(filter) function take(n, xs) { const ret = new xs.constructor() for (const x of xs) { if (n <= 0) { break } n-- ret['@@transducer/step'](x) } return ret } var rtake = curry(take)
take(3, range(10)) // [ 0, 1, 2 ]
take(4, new Set(range(10))) // Set (4) {0, 1, 2, 3}
const takeFirst3Odd = compose( rtake(3), rfilter(x => x % 2 === 1), rmap(x => x + 1) ) takeFirst3Odd(range(10)) // [ 1, 3, 5 ]
지금까지 구현한 내용은 표현이 명확하고 간결하지만 런타임에는 낭비입니다.
curry 버전의 지도 기능은 다음과 같습니다.
const map = f => xs => ...
즉, map(x => ...)는 단일 매개변수 함수를 반환합니다.
const list = [1, 2, 3, 4, 5] list.map(x => x + 1) // [ 2, 3, 4, 5, 6 ]
하나의 매개변수로 함수를 쉽게 구성할 수 있습니다.
구체적으로 이들 함수의 입력은 '데이터', 출력은 가공된 데이터, 함수는 데이터 변환기(Transformer)이다.
function map(f, xs) { const ret = [] for (let i = 0; i < xs.length; i++) { ret.push(f(xs[i])) } return ret }
map(x => x + 1, [1, 2, 3, 4, 5]) // [ 2, 3, 4, 5, 6 ]
function filter(f, xs) { const ret = [] for (let i = 0; i < xs.length; i++) { if (f(xs[i])) { ret.push(xs[i]) } } return ret }
Transformer는 단일 매개변수 함수로 함수 구성에 편리합니다.
var range = n => [...Array(n).keys()]
리듀서는 더 복잡한 논리를 표현하는 데 사용할 수 있는 2개의 매개변수 함수입니다.
filter(x => x % 2 === 1, range(10)) // [ 1, 3, 5, 7, 9 ]
function map(f, xs) { const ret = new xs.constructor() // 1. construction for (const x of xs) { // 2. iteration ret['@@transducer/step'](f(x)) // 3. collection } return ret }
Array.prototype['@@transducer/step'] = Array.prototype.push // [Function: push]
map(x => x + 1, [1, 2, 3, 4, 5]) // [ 2, 3, 4, 5, 6 ]
Set.prototype['@@transducer/step'] = Set.prototype.add // [Function: add]
take를 어떻게 구현하나요? Break와 유사한 기능을 가지려면 Reduce가 필요합니다.
map(x => x + 1, new Set([1, 2, 3, 4, 5])) // Set (5) {2, 3, 4, 5, 6}
function filter(f, xs) { const ret = new xs.constructor() for (const x of xs) { if (f(x)) { ret['@@transducer/step'](x) } } return ret }
filter(x => x % 2 === 1, range(10)) // [ 1, 3, 5, 7, 9 ]
드디어 우리의 주인공을 만나다
먼저 이전 지도 구현을 다시 검토하세요
filter(x => x > 3, new Set(range(10))) // Set (6) {4, 5, 6, 7, 8, 9}
위에서 언급한 배열(Array)에 의존하는 로직을 분리하여 감속기로 추상화하는 방법을 찾아야 합니다.
range(10) .map(x => x + 1) .filter(x => x % 2 === 1) .slice(0, 3) // [ 1, 3, 5 ]
구축도 사라지고, 반복도 사라지고, 요소의 수집도 사라졌습니다.
리듀서를 통해 지도에는 담당하는 로직만 포함됩니다.
필터를 다시 살펴보세요
function compose(...fns) { return fns.reduceRight((acc, fn) => x => fn(acc(x)), x => x) }
위의 rfilter와 rmap의 반환 유형을 확인하세요.
function curry(f) { return (...args) => data => f(...args, data) }
실제로는 매개변수와 반환 값이 모두 감소기인 변환기입니다.
Transformer는 구성 가능하므로 Transducer도 구성 가능합니다.
var rmap = curry(map) var rfilter = curry(filter) function take(n, xs) { const ret = new xs.constructor() for (const x of xs) { if (n <= 0) { break } n-- ret['@@transducer/step'](x) } return ret } var rtake = curry(take)
그런데 변환기는 어떻게 사용하나요?
take(3, range(10)) // [ 0, 1, 2 ]
take(4, new Set(range(10))) // Set (4) {0, 1, 2, 3}
리듀서를 이용하여 반복과 수집을 구현해야 합니다.
const takeFirst3Odd = compose( rtake(3), rfilter(x => x % 2 === 1), rmap(x => x + 1) ) takeFirst3Odd(range(10)) // [ 1, 3, 5 ]
이제 작동할 수 있으며 반복이 '주문형'이라는 점도 확인했습니다. 컬렉션에 100개의 요소가 있지만 처음 10개의 요소만 반복되었습니다.
다음으로 위의 논리를 함수로 캡슐화하겠습니다.
const map = f => xs => ...
type Transformer = (xs: T) => R
비동기 무한 피보나치 생성기와 같은 일종의 비동기 데이터 수집이 있다고 가정해 보겠습니다.
data ->> map(...) ->> filter(...) ->> reduce(...) -> result
function pipe(...fns) { return x => fns.reduce((ac, f) => f(ac), x) }
const reduce = (f, init) => xs => xs.reduce(f, init) const f = pipe( rmap(x => x + 1), rfilter(x => x % 2 === 1), rtake(5), reduce((a, b) => a + b, 0) ) f(range(100)) // 25
위 데이터 구조를 지원하는 into 함수를 구현해야 합니다.
참고로 코드의 배열 버전을 옆에 게시하세요.
type Transformer = (x: T) => T
구현 코드는 다음과 같습니다.
type Reducer = (ac: R, x: T) => R
수집 작업은 동일하지만 반복 작업은 다릅니다.
// add is an reducer const add = (a, b) => a + b const sum = xs => xs.reduce(add, 0) sum(range(11)) // 55
다른 데이터 구조에도 동일한 논리가 적용됩니다.
주의 깊게 보시면 카레 기반의 Compose 버전과 리듀서 기반 버전의 매개변수 순서가 다르다는 것을 아실 수 있을 것입니다.
const list = [1, 2, 3, 4, 5] list.map(x => x + 1) // [ 2, 3, 4, 5, 6 ]
function map(f, xs) { const ret = [] for (let i = 0; i < xs.length; i++) { ret.push(f(xs[i])) } return ret }
함수 실행은 오른쪽 결합입니다.
map(x => x + 1, [1, 2, 3, 4, 5]) // [ 2, 3, 4, 5, 6 ]
function filter(f, xs) { const ret = [] for (let i = 0; i < xs.length; i++) { if (f(xs[i])) { ret.push(xs[i]) } } return ret }
트랜스듀서 등장
변환기 - Clojure 참조
위 내용은 변환기: 강력한 기능 구성 패턴의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!