Как использовать оператор Rx.Observable.prototype.let?

Question

Пример и пояснение оператора let (https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/let.md) не ясны. У кого-нибудь есть хороший пример/объяснение, как работает оператор let, и когда мы должны его использовать?

Answer 1

&tldr;

Это удобная функция для возможности полочкам логики и ввести его в трубопровод.

Longer Объяснение

source, вероятно, наиболее окончательное объяснение. Это просто передача функции, вызываемой с источником 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);