在 Angular rxjs 中,我什么时候应该使用 `pipe` 和 `map` [英] In Angular rxjs when should I use `pipe` vs `map`

查看:41
本文介绍了在 Angular rxjs 中,我什么时候应该使用 `pipe` 和 `map`的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我对 pipe 运算符与仅链接 map 有点困惑.下面的两个示例在功能上是否相同?管道功能的目的或优势是什么?

const name = ajax.getJSON<{ name: string }>("/api/employees/alice").管道(重试(3, 1000),地图(员工 => 员工姓名),catchError(error => of(null)));

const name = ajax.getJSON<{ name: string }>("/api/employees/alice").let(重试(3, 1000)).map(employee =>employee.name).catch(error => Rx.Observable.of(null));

解决方案

新"的方式,使用 pipe,叫做 Lettable Operators Pipeable Operators.链接运算符的旧"方式称为使用补丁运算符".

<块引用>

从 5.5 版开始,我们提供了可管道操作符",可以在 rxjs/operators 中访问(注意复数的operators").与 rxjs/add/operator/* 中的补丁"操作符相比,这些是一种更好的方法来只引入你需要的操作符.

补丁操作符存在一些问题.他们还可以确保您的代码生成的包更小.还有其他优点,请参阅文档,其中对其进行了很好的介绍.>

尽管您的 2 个代码示例在功能上是等效的,但要回答您的其他问题.此外,您应该尽可能使用 Pipeable Operators 而不是 Patch Operators.

<小时>

来自文档(完整性)

<块引用>

用于点链的修补运算符的问题是:

  1. 任何导入补丁运算符的库都会为该库的所有使用者增加 Observable.prototype,从而创建盲依赖.如果图书馆删除了他们的使用,他们会在不知不觉中破坏其他人.对于可管道,您必须将所需的运算符导入到使用它们的每个文件中.
  2. 直接修补到原型上的 Operator 无法通过 rollup 或 webpack 等工具进行摇树".可管道操作符将是直接从模块中提取的函数.
  3. 任何类型的构建工具或 lint 规则都无法可靠地检测到应用中导入的未使用运算符.这意味着您可能会导入 scan,但停止使用它,它仍会被添加到您的输出包中.对于可管道操作符,如果您不使用它,lint 规则可以为您找到它.
  4. 功能组合很棒.构建您自己的自定义运算符变得更加容易,现在它们的工作方式和外观与 rxjs 中的所有其他运算符一样.您不再需要扩展 Observable 或覆盖 lift.

I'm a bit confused by the pipe operator vs just chaining map. Are both of the examples below functionally equivalent? What is the purpose or advantage of the pipe function?

const name = ajax
  .getJSON<{ name: string }>("/api/employees/alice")
  .pipe(
    retry(3, 1000),
    map(employee => employee.name),
    catchError(error => of(null))
  );

const name = ajax
  .getJSON<{ name: string }>("/api/employees/alice")
  .let(retry(3, 1000))
  .map(employee => employee.name)
  .catch(error => Rx.Observable.of(null));

解决方案

The "new" way, using pipe, is called Lettable Operators Pipeable Operators. The "old" way, where you chain operators, is called using "patch operators".

Starting in version 5.5 we have shipped "pipeable operators", which can be accessed in rxjs/operators (notice the pluralized "operators"). These are meant to be a better approach for pulling in just the operators you need than the "patch" operators found in rxjs/add/operator/*.

There were some problems with the patch operators. They can also ensure that your produced bundle from your code is smaller. There are other advantages as well, see the documentation which fairly well covers it.

To answer your other question though your 2 code samples are functionally equivalent. Also you should use Pipeable Operators over Patch Operators whenever possible.


From the documentation (for completeness)

Problems with the patched operators for dot-chaining are:

  1. Any library that imports a patch operator will augment the Observable.prototype for all consumers of that library, creating blind dependencies. If the library removes their usage, they unknowingly break everyone else. With pipeables, you have to import the operators you need into each file you use them in.
  2. Operators patched directly onto the prototype are not "tree-shakeable" by tools like rollup or webpack. Pipeable operators will be as they are just functions pulled in from modules directly.
  3. Unused operators that are being imported in apps cannot be detected reliably by any sort of build tooling or lint rule. That means that you might import scan, but stop using it, and it's still being added to your output bundle. With pipeable operators, if you're not using it, a lint rule can pick it up for you.
  4. Functional composition is awesome. Building your own custom operators becomes much, much easier, and now they work and look just like all other operators from rxjs. You don't need to extend Observable or override lift anymore.

这篇关于在 Angular rxjs 中,我什么时候应该使用 `pipe` 和 `map`的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆