IT이야기

Rx 사용법.관측 가능.프로토타입.교환원으로 보내시겠습니까?

cyworld 2022. 3. 22. 21:22
반응형

Rx 사용법.관측 가능.프로토타입.교환원으로 보내시겠습니까?

의 예와 설명.let연산자(https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/let.md)는 명확하지 않다.누구라도 좋은 예/설명서를 가지고 있다.let오퍼레이터가 작동하고, 언제 사용해야 하는가?

&tldr;

논리를 구획하여 파이프라인에 주입할 수 있는 편리함수다.

긴 설명

출처는 아마도 가장 결정적인 설명일 것이다.그것은 정말로 소스와 함께 불려지는 함수를 통과하는 것이다.Observable.

Rx.Observable.prototype.let = function(fn) {
  return fn(this);
}

이를 통해 여러 소스에 대해 재사용하고자 하는 파이프라인을 만들거나 미리 정의할 수 있다.Rx에 대한 공통 트로피를 고려해 보십시오. 반응형 검색 모음:

// Listen to a key up event on the search bar 
// and emit the value of the search
Rx.Observable.fromEvent(searchBar, 'keyup', e => e.target.value)
  // Don't search too eagerly
  .filter(text => text.length > 3)
  .debounceTime(500)
  //Search logic
  .flatMap(text => $.getJSON(`my/search/api?q=${text}`))
  .flatMap({results} => results)
  //Handler
  .subscribe(appendToList);

위의 내용은 파이프라인이 어떻게 생성될 수 있는지에 대한 기본적인 감각을 제공해야 한다.코드를 정리하거나 다른 곳에서 사용할 수 있도록 하기 위해 이러한 논리 중 일부를 추상화하려고 한다면, 약간 까다로울 수 있다. 왜냐하면 그것은 대개 새로운 운영자를 만드는 것을 의미하기 때문이다(그리고 그것 자체의 두통이 있다).

해결책은 출처를 통과할 수 있는 함수에 공통논리를 끌어들이는 비교적 간단한 접근법이다.Observable그리고 새로운 것을 돌려줄 것이다.Observable그런 논리를 적용해서.

따라서 위의 내용은 다음과 같을 수 있다.

//Defined in pipelines.js
function filterBuilder(minText, debounceTime) {
  return (source) => 
    source.filter(text => text.length > minText)
          .debounce(debounceTime);
}

function queryBuilder(baseUrl) {
  return (source) => 
    source.flatMap(text => $.getJSON(`${baseUrl}?q=${text}`))
          .flatMap({results} => results);
}


//In your application code

Rx.Observable.fromEvent(searchBar, 'keyup', e => e.target.value)
  .let(filterBuilder(3, 500))
  .let(queryBuilder('my/search/api'))
  .subscribe(appendResults);

참조URL: https://stackoverflow.com/questions/38340541/how-to-use-rx-observable-prototype-let-operator

반응형