Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

RXjs操作符 #10

Open
xiaoxiaosaohuo opened this issue Oct 7, 2017 · 0 comments
Open

RXjs操作符 #10

xiaoxiaosaohuo opened this issue Oct 7, 2017 · 0 comments

Comments

@xiaoxiaosaohuo
Copy link
Owner

xiaoxiaosaohuo commented Oct 7, 2017

RxJS如此强大的原因正是源自于它的操作符,即便可观察对象扮演着根基的角色。
操作符使得复杂的异步代码轻松的以声明的方式容易地组成。

什么是操作符?

操作符是可观察对象上定义的方法,例如.map(...),.filter(...),.merge(...),等等。当
他们被调用,并不会去改变当前存在的可观察对象实例。相反,他们返回一个新的
可观察对象,而且新返回的subscription订阅对象逻辑上基于第一个可观察对象

operator基于当前Observable创建一个新的Observable的函数。这是一个纯粹的操作:先前的Observable保持不变。

一个操作符本质上是一个将某个可观察对象作为输入然后输出另一个可观察对象的
纯函数。对输出的新的可观察对象进行订阅的同时也会订阅作为输入的那个可观察
对象。下面的例子,我们创建一个自定义的运算符函数,将从作为输入的可观察对
象的每个值乘以10.

function multiplyByTen(input) {
  var output = Rx.Observable.create(function subscribe(observer) {
    input.subscribe({
      next: (v) => observer.next(10 * v),
      error: (err) => observer.error(err),
      complete: () => observer.complete()
    });
  });
  return output;
}

var input = Rx.Observable.from([1, 2, 3, 4]);
var output = multiplyByTen(input);
output.subscribe(x => console.log(x));

log:
10
20
30
40

注意一下我们对output的订阅导致了作为输入的可观察对象也被订阅了。我们称这
种现象为"操作符的订阅链"。

实例运算符与静态运算符

通常在引用运算符时,我们假设是实例运算符,它们是Observable实例的方法。

  • 实例运算符是使用this关键字来推断输入Observable的函数

  • 静态操作符是直接定义在类上的。一个静
    态操作符并不在其内部使用this,而是完全依赖于它的参数。

静态操作符是定义在类上的函数,通常被用于从头重新创建一个可观察对象,它们仅接收一个非可观察对象作为参数,比如一个数字,然后构造出一个可
观察对象。

作为示例,如果multiplyByTen一个官方库中的操作符,那它大概是下面的样子:

Rx.Observable.prototype.multiplyByTen=function(){ 
    var input=this;
    return Rx.Observable.create(function subscribe(observer){
    input.subscribe({
    next:(v) => observer.next(10*v),
    error:(err)=>observer.error(err), 
    complete:()=>observer.complete() }); 
        
    });
    }


操作符定义在可观察对象的原型对象上,如果某个可观察对象调用这个方法,input首先取得作为输入的该可观察对象的引用(后面会在闭包里用到),然后该方法返回一个由create方法创建的可观察对象,也就是作为输出的可观察对象。而input.subscribe({...})是对input进行订阅。

注意input并不是作为函数的参数,而是作为this所指代的那个对象。

var observable = Rx.Observable.intervable(1000)//1000毫秒

var observable1 = Rx.Observable.interval(1000);
var observable2 = Rx.Observable.interval(400);
var merged = Rx.Observable.merge(observable1, observable2);

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant