Rx.Observable.prototype.let ऑपरेटर का उपयोग कैसे करें?

Question

let ऑपरेटर का उदाहरण और स्पष्टीकरण (https://github.com/Reactive-Extensions/RxJS/blob/master/doc/api/core/operators/let.md) स्पष्ट नहीं है। किसी के पास एक अच्छा उदाहरण/स्पष्टीकरण है कि let ऑपरेटर कैसे काम करता है, और जब हमें इसका उपयोग करना चाहिए?

Answer 1

&tldr;

यह तर्क compartmentalize और एक पाइप लाइन को इसकी सुई करने में सक्षम होने के लिए एक सुविधा कार्य है।

अधिक व्याख्या की

source शायद सबसे निश्चित व्याख्या है। यह वास्तव में सिर्फ एक समारोह गुजर रहा है जिसे स्रोत Observable के साथ बुलाया जाता है।

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

इस की उपयोगिता है कि हम बना सकते हैं या एक पाइप लाइन है कि आप एक से अधिक स्रोतों के लिए पुन: उपयोग करना चाहते हैं पूर्व परिभाषित है। आरएक्स, प्रतिक्रियाशील खोज पट्टी के लिए एक आम खीस्तयाग पर विचार करें:

// 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);