RxJS入门(2)---Observable的介绍

本文介绍了RxJS中Observable的创建方法,包括通过create操作符、使用ajax、根据Array、Event和Callback创建Observable。同时阐述了Observer与Observable的关联,以及常见的操作符,如create、from和fromEvent等,强调了将数据转化为Observable的好处和RxJS操作符的灵活性。
摘要由CSDN通过智能技术生成

创建Observable

  • 有好多种方式创建Observable,但是最常见的方式之一就是通过create操作符。在Rx.Observalbe对象的create操作符中需要传递一个回调函数,这个回调函数中需要传递一个订阅者参数(Observer,相当于(1)中传统观察者模式中的listener)。在这个方法中定义了Observable如何发射值,下面就举个例子来说明:
var observable = Rx.Observable.create(function(observer) {
   
observer.onNext('Simon');
observer.onNext('Jen');
observer.onNext('Sergi');
observer.onCompleted(); // 成功完成
});

当我们订阅这个Observable,它通过调用onNext()发射三个字符串给他的订阅者(监听者),最后调用onCompleted()标识这个序列完成了,但是我们是如何准确的订阅一个Observable了?通过Observers(也就是订阅者)。(补充:Observable可翻译为,可被订阅者,但是感觉怪怪的,就直译了)

与observer的关联

  • observers监听observable,不论何时在Observable中发生了什么事件,它会调用它的observers中相应的方法。
  • observers有三个方法:onNext,onCompleted,onError。
  • onNext:相当于在(1)中observer模式中的Update方法,当observable发射了一个新值它就会被调用。注意到那个名称是如何反应到我们订阅的序列中的,而不是仅仅分离的值。
  • onCompleted:再没有任何有效数据的信号,在onCompleted被调用后,之后的onNext调用将会无效。
  • onError:当observable中发生了错误后将会被调用,在onError被调用后,之后的onNext调用将会无效。
    下面可以举个例子说明我们是如何创建observer的:
var observer = Rx.Observer.create(
function onNext(x) {
    console.log('Next: ' + x); },
function onError(err) {
    console.log('Error: ' + err); },
function onCompleted() {
    console.log('Completed'); }
);

在Rx.Observer对象的create方法中有onNext,onCompleted,onError三个方法,并且他返回的也是一个Observer的对象实例。这三个方法是可选的,你根据你的需求来决定。例如,我们订阅一个无限的序列(比如按钮的点击事件,用户可以一直保持点击),onCompleted函数将永不会调用&

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值