We will learn how to perform network requests to a backend using RxJS Observables.

A example of basic jquery request:

console.clear();
var requestStream = Rx.Observable.just('https://api.github.com/users'); //Current requestStream is just a stream
//We need to subscribe it to make it work
requestStream.subscribe(url => { //Preform a serve reqest by jQuery
jQuery.getJSON(url).done( res => {
console.log(res);
})
});

But it not make so many sence we use jQuery to handle the promise since we already using RxJS:

console.clear();
var requestStream = Rx.Observable.just('https://api.github.com/users'); //Current requestStream is just a stream
//We need to subscribe it to make it work
requestStream.subscribe( url => { //Using Rx.Observable.fromPromise() to handle the response
//Since jQuery.getJSON(url) return a promise
//there we put into the fromPromise() function
var responseStream = Rx.Observable.fromPromise(jQuery.getJSON(url)); //Then subscribe the responseStream
responseStream.subscribe( res => {
console.log(res);
});
});

We see that we can accomplish with promise we also can do in Observable. And the main problem for promise is that promise only even yield a single value. But observalbe can have mult events.

But soon we find we subscribe an stream inside another subscribe, this is what we don't have to do, normal way to avoid this is using flatMap().

Here we do flagMap() but not map() is because inside map() a observable and return another observable then we got an observable of observable.

console.clear();
var requestStream = Rx.Observable.just('https://api.github.com/users');
var responseStream = requestStream
.flatMap( url => Rx.Observable.fromPromise(jQuery.getJSON(url))); responseStream.subscribe( res => console.log(res));

Now we have only one subscribe.

[Reactive Programming] Async requests and responses in RxJS的更多相关文章

  1. [RxJS] Reactive Programming - New requests from refresh clicks -- merge()

    Now we want each time we click refresh button, we will get new group of users. So we need to get the ...

  2. [RxJS] Reactive Programming - Clear data while loading with RxJS startWith()

    In currently implemention, there is one problem, when the page load and click refresh button, the us ...

  3. [RxJS] Reactive Programming - Rendering on the DOM with RxJS

    <!DOCTYPE html> <html> <head> <script src="https://code.jquery.com/jquery- ...

  4. [RxJS] Reactive Programming - Using cached network data with RxJS -- withLatestFrom()

    So now we want to replace one user when we click the 'x' button. To do that, we want: 1. Get the cac ...

  5. [Reactive Programming] RxJS dynamic behavior

    This lesson helps you think in Reactive programming by explaining why it is a beneficial paradigm fo ...

  6. [RxJS] Reactive Programming - What is RxJS?

    First thing need to understand is, Reactive programming is dealing with the event stream. Event stre ...

  7. .Net中的反应式编程(Reactive Programming)

    系列主题:基于消息的软件架构模型演变 一.反应式编程(Reactive Programming) 1.什么是反应式编程:反应式编程(Reactive programming)简称Rx,他是一个使用LI ...

  8. ReactiveCocoa与Functional Reactive Programming

    转自 http://blog.leezhong.com/ios/2013/06/19/frp-reactivecocoa.html Functional Reactive Programming(以下 ...

  9. "Principles of Reactive Programming" 之 <Persistent Actor State>学习笔记

    这是<Pinciples of Reactive Programming>week6的最后一课. 为什么需要把actor的状态持久化? 如果actor没有状态,那么在任何实时,这个acto ...

随机推荐

  1. quick-x 触摸事件的新方法

    --[[ local function onTouch(event, x, y) print(event, x, y) if event == "began" then retur ...

  2. [BZOJ 3218] A + B Problem 【可持久化线段树 + 网络流】

    题目连接:BZOJ - 3218 题目分析 题目要求将 n 个点染成黑色或白色,那么我们可以转化为一个最小割模型. 我们规定一个点 i 最后属于 S 集表示染成黑色,属于 T 集表示染成白色,那么对于 ...

  3. App Store内购

    一.In App Purchase概览 Store Kit代表App和App Store之间进行通信.程序将从App Store接收那些你想要提供的产品的信息,并将它们显示出来供用户购买.当用户需要购 ...

  4. iOS,OC,图片相似度比较,图片指纹

    上周,正在忙,突然有个同学找我帮忙,说有个需求:图片相似度比较. 网上搜了一下,感觉不是很难,就写了下,这里分享给需要的小伙伴. 首先,本次采用的是OpenCV,图片哈希值: 先说一下基本思路: 1. ...

  5. 第1章 开发环境安装和配置(二)安装JDK、SDK、NDK

    原文 第1章 开发环境安装和配置(二)安装JDK.SDK.NDK 无论是用C#和VS2015开发Androd App还是用Java和Eclipse开发Androd App,都需要先安装JDK和Andr ...

  6. Spring Batch系列总括(转载)

    最近一个项目在使用SpringBatch框架做一个电子商务平台的批处理.网上资料很有限,尤其是中文资料更是少之又少,官网上的文档也只是讲一些入门的基础知识,大部分高级特性都是一笔带过,讲解的很不彻底, ...

  7. c3p0数据库连接池的使用

    一.c3p0与dbcp区别 dbcp没有自动回收空闲连接的功能 c3p0有自动回收空闲连接功能 <C3P0是Hibernate3.0默认的自带数据库连接池,DBCP是Apache开发的数据库连接 ...

  8. bzoj2809

    可以先穷举那个是管理者,然后就发现其实就是求每个子树选尽可能多的人,使薪水和小于m这显然是从小往大选,可以用启发式合并但是用主席树写的更简单一点吧,dfs序之后每课线段树不仅维护出现出现个数,然后在维 ...

  9. PHP Sessions子系统会话固定漏洞

    漏洞名称: PHP Sessions子系统会话固定漏洞 CNNVD编号: CNNVD-201308-193 发布时间: 2013-08-22 更新时间: 2013-08-22 危害等级: 中危   漏 ...

  10. wpa_supplicant无线网络配置

    目前可以使用wireless-tools 或wpa_supplicant工具来配置无线网络.请记住重要的一点是,对无线网络的配置是全局性的,而非针对具体的接口. wpa_supplicant是一个较好 ...