Angular 教程中的 pipe 和 tap 方法是啥？

Posted 2023-03-13

【中文标题】Angular 教程中的 pipe 和 tap 方法是啥？

【英文标题】：What are pipe and tap methods in Angular tutorial?Angular 教程中的 pipe 和 tap 方法是什么？

【发布时间】：2018-04-26 18:54:31

【问题描述】：

我正在学习https://angular.io 上的教程，但找不到文档；专门针对pipe 和tap 方法。我在https://angular.io 或http://reactivex.io/rxjs/ 上找不到任何东西。

我的理解是pipe和tap都是从RxJS导入的Observable的方法，对吗？他们应该做什么？

这些方法是 Angular 的一部分吗？这两种方法的作用是什么？

【问题讨论】：

当用户提出正确的问题，得到正确的答案时，我觉得很奇怪，但是对于模组来说却一无所知 OP 在问什么 :D - 为什么这是“跑题”？跨度>

【参考方案1】：

您是对的，文档缺少这些方法。然而，当我深入研究 rxjs 存储库时，我发现了关于 tap（此处粘贴太长）和 pipe 运算符的不错的 cmets：

  /**
   * Used to stitch together functional operators into a chain.
   * @method pipe
   * @return Observable the Observable result of all of the operators having
   * been called in the order they were passed in.
   *
   * @example
   *
   * import  map, filter, scan  from 'rxjs/operators';
   *
   * Rx.Observable.interval(1000)
   *   .pipe(
   *     filter(x => x % 2 === 0),
   *     map(x => x + x),
   *     scan((acc, x) => acc + x)
   *   )
   *   .subscribe(x => console.log(x))
   */

简而言之：

管道：用于将功能运算符拼接成一个链。在我们可以只做 observable.filter().map().scan() 之前，但由于每个 RxJS 运算符都是一个独立的函数而不是 Observable 的方法，我们需要 pipe() 来创建这些运算符的链（参见上面的示例）。

点击：可以对观察到的数据执行副作用，但不会以任何方式修改流。以前称为do()。你可以把它想象成 observable 是一个随时间变化的数组，那么 tap() 将等同于 Array.forEach()。

【讨论】：

感谢您的回答和链接。我的部分问题是我是 Angular 的新手，我不确定哪些方法是核心 javascript 或 Node.js 或 RxJS 或 Angular 的一部分。你的回答帮助我澄清了这一点。谢谢。

@BenRubin 我建议您在开始学习工具之前先正确学习原生 JS。它将更容易理解这些工具及其实际作用（以及了解哪些部分是本机与工具）。

从 5.5 开始并引入了 pipeable（曾经称为 lettable）操作符，do 被更名为tap... 简而言之，就是一团糟。 github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md

filter 就像Array.filter 一样工作 - 只保留满足规则的值（在这种情况下可被 2 整除）； map（又像Array.map）更改每个值（在这种情况下将其添加到自身）； scan 是最有趣的，这里有一个很好的解释：learnrxjs.io/operators/transformation/scan.html

看起来扫描减少了