我每天都在使用的 10 个 RxJS 运算符_vue rxjs subject pipe map

).subscribe(user => console.log(user));

#### **catchError():**


此运算符用于处理可观察对象抛出的错误。它以一个函数作为参数，它接收错误作为输入并返回一个新的可观察对象。 


返回的可观察对象可以发出新值、完成或抛出另一个错误。例如，您可以使用 catchError() 重试失败的 HTTP 请求：

import { catchError } from ‘rxjs/operators’;
import { HttpClient } from ‘@angular/common/http’;

constructor(private http: HttpClient) {}

this.http.get(‘/api/data’).pipe(
  catchError(() => this.http.get(‘/api/fallbackData’))
).subscribe(data => console.log(data));

#### **tap():**


此运算符用于在不修改可观察对象的发射值的情况下执行副作用。它以一个函数作为参数，它接收发出的值作为输入并可以执行任何副作用。 


返回值被忽略，原始值不变。例如，您可以使用 tap() 来记录可观察对象发出的值：

import { tap } from ‘rxjs/operators’;
import { of } from ‘rxjs’;

of(1, 2, 3).pipe(
  tap(value => console.log(Emitting value: ${value}))
).subscribe();

#### **take():**


此运算符用于限制可观察对象发出的值的数量。这是一个例子：

import { take } from ‘rxjs/operators’;
import { of } from ‘rxjs’;

of(1, 2, 3, 4, 5).pipe(
  take(3)
).subscribe(value => console.log(value)); // output: 1, 2, 3

在此示例中，take(3) 用于将 of(1, 2, 3, 4, 5) 发出的数字流限制为前三个值。


#### **debounceTime():**


此运算符用于按指定的时间量对值流进行去抖动。这是一个例子：

import { debounceTime } from ‘rxjs/operators’;
import { fromEvent } from ‘rxjs’;

const input = document.getElementById(‘input’);

fromEvent(input, ‘input’).pipe(
  debounceTime(500)
).subscribe(event => console.log(input.value));

在此示例中，debounceTime(500) 用于将来自输入元素的输入事件流去抖动 500 毫秒。这意味着如果用户快速连续键入，则只会记录 500 毫秒不活动后的输入值。


#### **distinctUntilChanged():**


此运算符用于仅从值流中发出不同的值。这是一个例子：

import { distinctUntilChanged } from ‘rxjs/operators’;
import { of } from ‘rxjs’;

of(1, 2, 2, 3, 3, 3, 4).pipe(
  distinctUntilChanged()
).subscribe(value => console.log(value)); // output: 1, 2, 3, 4

在此示例中，distinctUntilChanged() 用于仅从 of(1, 2, 2, 3, 3, 3, 4) 发出的数字流中发出不同的值。


#### **merge():**


此运算符用于将多个可观察对象合并为一个可观察对象。这是一个例子：

import { merge } from ‘rxjs’;
import { interval } from ‘rxjs’;

const obs1 = interval(1000);
const obs2 = interval(2000);

merge(obs1, obs2).subscribe(value => console.log(value));

在此示例中，merge(obs1, obs2) 用于将两个可观察对象 obs1 和 obs2 合并为一个可观察对象，该可观察对象从两个可观察对象发出值。


#### **combineLatest():**


该运算符将多个可观察对象发出的最新值组合到一个数组中。它仅在其中一个源可观察对象发出新值时发出新数组。

import { combineLatest, timer } from ‘rxjs’;
import { map } from ‘rxjs/operators’;

const observable1 = timer(0, 1000).pipe(map(x => x + ’ seconds’));
const observable2 = timer(500, 500).pipe(map(x => x + ’ half seconds’));

combineLatest([observable1, observable2]).subscribe(combinedValues => {
  const [value1, value2] = combinedValues;
  console.log(observable1: ${value1}, observable2: ${value2});
});

文末

技术是没有终点的，也是学不完的，最重要的是活着、不秃。

零基础入门的时候看书还是看视频，我觉得成年人，何必做选择题呢，两个都要。喜欢看书就看书，喜欢看视频就看视频。

最重要的是在自学的过程中，一定不要眼高手低，要实战，把学到的技术投入到项目当中，解决问题，之后进一步锤炼自己的技术。

自学最怕的就是缺乏自驱力，一定要自律，杜绝“三天打鱼两天晒网”，到最后白忙活一场。

高度自律的同时，要保持耐心，不抛弃不放弃，切勿自怨自艾，每天给自己一点点鼓励，学习的劲头就会很足，不容易犯困。

技术学到手后，找工作的时候一定要好好准备一份简历，不要无头苍蝇一样去海投简历，容易“竹篮打水一场空”。好好的准备一下简历，毕竟是找工作的敲门砖。

拿到面试邀请后，在面试的过程中一定要大大方方，尽力把自己学到的知识舒适地表达出来，不要因为是自学就不够自信，给面试官一个好的印象，面试成功的几率就会大很多，加油吧，骚年！

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】