2016-03-14 77 views
5

我是反應式編程的新手,我有點遺失閱讀所有這些我無法理解的文章。使用Javascript進行反應式編程

其實,我是一個來自Nodejs,Angularjs,Angular 2和React的javascript開發人員。

我做什麼

我用諾言所有的時間,進行遠程數據抓取,本地異步分辨率等等更好的可測試性比回調和適合我的需要。

我明白使用流

我想不通的地方流能救我,除了在特定情況下是什麼。

這種特殊情況是,我不能在聽流時使用承諾,因爲承諾只能解決一次。

與SocketIo一個例子:

io.on('connection', (socket) => { 
    // this works 
}); 

io.on('connection').then((socket) => { 
    // this can't work, promise would be resolved only once 
}); 

如果我不是錯了,我可以用反應流通過返回一個可觀察來管理這種情況。對 ?

我不明白

我米左右學習角2和所有的東西。實際上,從許多博客中,人們使用observables來獲取遠程數據,我無法理解使用它而不是承諾的優勢。

事實是,我需要在這兩種情況下製造一個遙控器,爲什麼比另一個更多?這是一個性能問題?

我需要

如果您已經閱讀了全部問題,我需要的是要了解什麼是使用遠程數據獲取的情況下反應式編程,而不是承諾的優勢是什麼?

在哪個(其他情況下)使用反應性的東西比平常的東西更好?

+0

閱讀這個問題,將澄清很多https://開頭的github .com/angular/angular/issues/5876 –

回答

3

基本上,如果你有一個單獨的異步事件你不想得到關於(回調)通知你使用Promise。如果你期望的一系列事件使用的ObservableObservable

優勢超過Promise

  • 可觀察可以取消
  • 可觀察懶
  • 可觀察可以(被訂閱之前沒有做任何事情)做什麼Promise可以但只有使用Observable允許您以相同的方式編碼(使用rx運算符而不是.then(),無論您是否期望發生一個或一系列事件)
+0

嗨!我知道這是一個古老的答案,但我可能不清楚的一件事。可觀察者能爲後來的用戶保留一個返回值,類似於已經解決的承諾將如何立即「.then()'d?另外,你是否可以擁有多個觀察者的訂閱者而不影響其操作(例如,使其異步調用兩次)如果你認爲值得自己的問題,我可以這樣做。 – Katana314

+0

'BehaviorSubject'創建一個'Observable',它將最後一個值立即返回給新的訂閱者。 '.share()'操作符創建一個'Observable'多播,每個事件都傳遞給每個用戶。注意 - 你需要顯式地導入運算符(比如'map','share',...)。 –

6

@Günter給你的觀察者的基礎,特別是承諾的能力被稱爲。爲了更進一步,我認爲observables的關鍵優勢在於能夠使用運算符構建異步數據流/流。

下面是一些具體的使用情況:

  • debounceTime/switchMap。當您想要利用表單輸入來根據相應的HTTP請求篩選列表時,您需要用於請求的值是用戶完成寫入時的值。沒有必要發送幾個請求:每個新字符(一個用於's',一個用於'so',一個用於'som',...,一個用於'搜索的東西')。 debounceTime運營商通過緩衝事件並在不活動時間後提供最後一個來允許這種情況。

    這裏有一個例子:

    @Component({ 
        (...) 
        template: ` 
        <input [ngFormControl]="ctrl"/> 
        ` 
    }) 
    export class MyComponent { 
        constructor() { 
        this.ctrl = new Control(); 
        this.ctrl.valueChanges 
           .debounceTime(500) 
           .distinctUntilChanged() 
           .switchMap((vallue: string) => { 
           // Get data according to the filled value 
           return this.service.getData(entry); 
           }) 
           .subscribe(data => { 
           // Update the linked list 
           this.list = data; 
           }); 
        } 
    } 
    

    如果你只使用switchMap,你將有每輸入,但以前正在進行的請求將被取消一個請求。這允許您獲得正確的結果,尤其是對於某些請求的請求執行時間更長的情況。

    在這種情況下,您可以將事件從Web UI(DOM事件)鏈接到HTTP請求以相應執行(對事件作出反應)並應用一些高級行爲。

  • 執行重試。通過混合retryWhendelaytimeout運營商,你可以很容易地(且透明)實施重試

    searchPlaces(searchText:string) { 
        var params = new URLSearchParams(); 
        params.set('placename_startsWith', searchText); 
        params.set('username', 'templth'); 
    
        return this.http.get('http://api.geonames.org/postalCodeSearchJSON', 
         { search: params }) 
        .retryWhen(error => error.delay(500)) 
        .timeout(2000, return new Error('delay exceeded')) 
        .map(res => res.json().postalCodes); 
    } 
    

我認爲這是可觀察的實際功率:異步處理鏈/數據流和連接不同的部分基於事件的應用程序。這是承諾不能完成的事情,並且允許實現用例來使應用程序更健壯。

這是一系列的文章,可以給你更多的細節: