Rxjs概念 学习

        RxJS 是一个流式编程库,用于处理异步数据流和事件流。它基于观察者模式和迭代器模式,提供了丰富的操作符和工具,用于处理和操作数据流。RxJS 的核心概念包括可观察对象(Observable)、观察者(Observer)、操作符(Operators)和调度器(Schedulers)等

1. 概念:

  • 可观察对象(Observable):表示一个异步数据流,可以发出零个或多个值,并在完成或出错时终止。可观察对象是 RxJS 的核心概念,它可以被订阅,用来处理异步事件和数据流。
  • 观察者(Observer):表示一个回调函数集合,它定义了对可观察对象发出的事件进行处理的方式。观察者可以接收来自可观察对象的值、错误和完成信号。
  • 操作符(Operators):用于处理和转换可观察对象的操作符,例如 map、filter、mergeMap等。操作符可以对可观察对象发出的数据进行处理和转换。
  • 调度器(Schedulers):用于控制可观察对象的订阅和发出的时机,例如 observeOn、subscribeOn等。调度器可以控制可观察对象的异步行为。

2. 用法:
        RxJS 的用法主要包括创建可观察对象订阅可观察对象使用操作符进行数据处理和转换处理错误和完成信号等。

示例代码解析:

  1. 首先,我们使用 new Observable 创建了一个简单的可观察对象 observable,并在构造函数中定义了发出值的逻辑。在这个例子中,我们依次使用 subscriber.next 发出了两个值(1 和 2),然后调用 subscriber.complete 表示数据流结束。

  2. 然后,我们创建了一个观察者对象 observer,它包含了 nexterror 和 complete 方法,用于处理可观察对象发出的值、错误和完成信号。

  3. 最后,我们调用 observable.subscribe(observer) 方法,将观察者对象订阅到可观察对象上。这样,当可观察对象发出值时,观察者对象的 next 方法会被调用来处理这些值,当可观察对象完成时,观察者对象的 complete 方法会被调用。

示例代码: 

import { Observable } from 'rxjs';

// 创建一个简单的可观察对象
const observable = new Observable(subscriber => {
  subscriber.next(1);
  subscriber.next(2);
  subscriber.complete();
});

// 创建观察者
const observer = {
  next: value => console.log(value),
  error: error => console.error(error),
  complete: () => console.log('Complete')
};

// 订阅可观察对象
observable.subscribe(observer);

3. 常用属性和方法:
        RxJS 提供了丰富的属性和方法用于创建、操作和处理可观察对象。一些常用的属性和方法有:

  • Observable.create:用于创建一个新的可观察对象。
    import { Observable } from 'rxjs';
    
    const observable = Observable.create(subscriber => {
      subscriber.next(1);
      subscriber.next(2);
      subscriber.complete();
    });
    
  • Observable.of:用于创建一个发出指定值的可观察对象。
    import { Observable } from 'rxjs';
    
    const observable = Observable.of(1, 2, 3);
    
  • Observable.from:用于将一个数组、类数组或可迭代对象转换为可观察对象。
    import { Observable } from 'rxjs';
    
    const observable = Observable.from([1, 2, 3]);
    
  • Observable.prototype.subscribe:用于订阅可观察对象,并传入观察者来处理发出的值。
    observable.subscribe(
      value => console.log(value),
      error => console.error(error),
      () => console.log('Complete')
    );
    
  • Observable.prototype.pipe:用于使用操作符对可观察对象进行处理和转换。
    import { map, filter } from 'rxjs/operators';
    
    observable.pipe(
      filter(value => value > 1),
      map(value => value * 10)
    ).subscribe(value => console.log(value));
    
  •  map、filter、mergeMap等操作符方法用于对可观察对象发出的数据进行处理和转换。

猜你喜欢

转载自blog.csdn.net/qq_44327851/article/details/135251408