美文网首页
RxJS 学习手记

RxJS 学习手记

作者: Simar | 来源:发表于2020-04-30 12:58 被阅读0次

参考:


在 RxJS 中用来解决异步事件管理的的基本概念是:

  • Observable (可观察对象): 表示一个概念,这个概念是一个可调用的未来值或事件的集合。*
  • Observer (观察者): 一个回调函数的集合,它知道如何去监听由 Observable 提供的值。
  • Subscription (订阅): 表示 Observable 的执行,主要用于取消 Observable 的执行。
  • Operators (操作符): 采用函数式编程风格的纯函数 (pure function),使用像 map、filter、concat、flatMap 等这样的操作符来处理集合。
  • Subject (主体): 相当于 EventEmitter,并且是将值或事件多路推送给多个 Observer 的唯一方式。
  • Schedulers (调度器): 用来控制并发并且是中央集权的调度员,允许我们在发生计算时进行协调,例如 setTimeout 或 requestAnimationFrame 或其他。

概念比较晦涩,通俗的说。
Observable 理解成一个自媒体。
Observer 是这个自媒体发布的作品。
Operators 是对发布作品的一系列操作,比如延迟发送作品,更新作品。
当这个事件被人订阅时(subscribe)才知道这个时间发生了。
当这个这个事件取消订阅时(unsubscribe)没有知道事件发生了。

如下例子:

  1. Up 主想发布作品123,但是Up 有一点自己小想法。
  2. 思考了1秒钟
  3. Up主想在作品123 的基础上做一些修改,并作为作品 1
  4. Up主想在作品1的基础上做一些修改,并作为作品 1Test2
  5. 最后我们看到就是Up 的作品1Test2
  rxJSTest() {
    let value =123;
    Rx.Observable.create((observe) => {
      observe.next(value);
    }).pipe(
      delay(1000),
      // pluck('error_code','Checklist','ResultTemplate',"Token"),
      concatMap((data) => {
        console.info("作品",  data);  //作品 123
        return Rx.Observable.create((observe) => {
          console.info("作品", data); //作品 123
          observe.next(1);
        });
      }),
      concatMap((data) => {
        console.info("作品 ", data); //作品  1
        return Rx.Observable.create((observe) => {
          console.info("作品 ",  data); //作品  1
          data = data+"Test2";
          observe.next(data); 
        });
      })
    )
      .subscribe((vale) => {
        console.info("作品 ",vale);//作品  1Test2
      }, err => {
        console.info(err);
      }, (vale) => { console.info("COMPLETE", vale) });
  }
}

相关文章

  • RxJS 学习手记

    参考: 可观察对象与其它技术的比较 Rxjs 5 中文参考文档 在 RxJS 中用来解决异步事件管理的的基本概念是...

  • Rxjs系列教程目录

    RxJS-中文文档RxJS-中文指南 rxjs学习入门心得(一)Observable可观察对象rxjs学习入门心得...

  • Rxjs入门与初步应用

    学习资料 https://cn.rx.js.org/https://github.com/RxJS-CN/rxjs...

  • 第1章 函数响应式编程

    注: 学习程墨老师《深入浅出RxJS》的笔记 RxJS采用了函数响应式编程。RxJS世界中有一种特殊的对象,称为流...

  • RXJS学习资料

    这里推荐几篇好的学习资料,我就不再整理了Observable详解RxJS Operators 详解rxjs官方文档...

  • RxJS简易入门

    什么是RxJS?RxJS解决什么样的问题?通过怎么样的手段?带着这些问题,我们便来学习一下RxJS,本文旨在帮助大...

  • Rxjs学习

    一个可观察对象的执行期间,零个到无穷多个next通知被发送。如果Error或者Complete通知一旦被发送,此后...

  • Rxjs学习

    RXJs 1、 Example 简单来说就是promise的加强版这是个promise的用法 Observable...

  • RxJS学习笔记1

    前置:我目前的学习资料是30天精通RxJS,那个时候的RxJS是5.x版本,而目前最新版本是RxJS 6,所以资料...

  • 01RxJS-响应式编程类库

    rxjs-响应式编程类库)RxJS官网[https://rxjs.dev/] RxJS(Reactive Exte...

网友评论

      本文标题:RxJS 学习手记

      本文链接:https://www.haomeiwen.com/subject/zuzawhtx.html