可以使用RxJS操作符的順序

Question

根據此文檔https://xgrommx.github.io/rx-book/content/observable/observable_instance_methods/index.html，Observable方法和Observable實例方法之間存在主要分離。我知道Observable方法總是在Observable實例方法之前調用。希望這是真的。但是我們可以使用什麼順序來組合/混合Observable實例方法？

我有什麼要解決的問題是爲什麼兩個類似的Observables的結果是不一樣的。

第一個：

let getRequestJson = this.http.get(this.config.apiUrl + '/users', new RequestOptions({params: this.params})) 
    .map((response: Response) => response.json()); 
console.log(getRequestJson); 

let doThroughTheJsonData = getRequestJson.do(data => { 
    this.count = data.count; 
    this.loading = false; 
    this.currentPage = page; 
}); 
console.log(doThroughTheJsonData); 

this.asyncUsers = doThroughTheJsonData.map(data => { 
    return data.user; 
}); 
console.log(this.asyncUsers); 

輸出：

Observable {_isScalar: false, source: Observable, operator: MapOperator} 
Observable {_isScalar: false, source: Observable, operator: DoOperator} 
Observable {_isScalar: false, source: Observable, operator: MapOperator} 

二之一：

this.params.page = page; 
    let options = new RequestOptions({ params: this.params }); 

    let getRequest = this.http.get(this.config.apiUrl + '/users', options); 
    console.log(getRequest); 
    let doThroughTheData = getRequest.do(data => { 
     this.count = data.json().count; 
     this.loading = false; 
     this.currentPage = page; 
     }); 
    console.log(doThroughTheData); 
    this.asyncUsers = doThroughTheData.map((response: Response) => response.json().users); 
    console.log(this.asyncUsers); 

輸出：

Observable {_isScalar: false, source: Observable, operator: CatchOperator} 
Observable {_isScalar: false, source: Observable, operator: DoOperator} 
Observable {_isScalar: false, source: Observable, operator: MapOperator} 

最後，我在asyncUsers中收到的內容看起來像不同的Observable，雖然應該是相同的。 在第一個我做 1. MAP上的數據轉換爲json格式的數據。 2.然後可觀察到的DO從json數據獲取一些數據 3.我再次使用MAP從json數據獲取用戶數據。

在第二個我做 1.第一DO和裏面我第一次傳輸的響應數據JSON和我得到了我需要的 2.然後映射轉型爲JSON並獲得唯一從JSON數據的用戶數據。

是這個問題可觀察的具體，它是關係到方法map-do-map/do-map的順序，或者是明確的typescript錯誤。

Answer 1

在調用它的方法之前，您需要一個Observable的實例。要創建一個Observable，您可以提供一個Observable，或者使用靜態方法/構造函數創建一個Observable。

一般Rx工作流程：

• 得到一些觀察，（外部/靜態方法）
• 轉變可觀察（實例方法）
• subscribe獲取數據出來

獲取a Observable

var instance = Rx.Observable.of(1, 2, 3) 

給你的值的流1，2和3

var instance = new Rx.Observable(observer => { 
    /* do whatever you want with observer 
    for example: */ 
    observer.next(1) 
    observer.next(2) 
    observer.next(3) 
    observer.complete() 
}) 

給你一個同樣表現觀察到。

你也可以從外部獲得Observables：在你的例子中http.get返回一個Observable。

使用/改造可觀察

創建後/檢索到的可觀察到的，可以使用可觀測實例任何方法來將流或它的內容。

例如：

var doubled = instance.map(x => x * 2) 

這裏面的一切加倍。 instance未被修改。您創建了一個新的Observable實例doubled，它的行爲相同，但值增加了一倍。

有許多運營商。完整列表見http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html。

使用可觀察

這是你從可觀察提取數據。這是你會做副作用的地方。您可以撥打subscribe，每次有新數據可用時，都會調用您的回調。

doubled.subscribe(x => view.x = x) 

你的情況：

var subscription = getRequestJson.subscribe(data => { 
    this.count = data.count; 
    this.loading = false; 
    this.currentPage = page; 
}); 

你得到了調用subscribe的是一個對象，你可以用它來讓源知道你不再有興趣。 subscription.unsubscribe()確保您的回調不再被調用。

你的樣品

你似乎日誌可觀察的本身，而不是值內。查看Observable作爲數據如何流動的藍圖。本身並不是那麼有趣，有趣的是裏面有什麼。因此請使用subscribe來獲取這些數據。

您使用.do(...)設置一些值，不要做do;）。如果您始終使用.do，您可能會遇到實際上沒有任何事情完成的情況：如果您從未致電訂閱，則永遠不會讓源知道您有興趣。

如果您使用的是Angular類型，Angular可能會爲您做subscribe調用，但前提是您將Observable移交給Angular。如果讓它鬆動，則不會創建訂閱。