照顾rxjs开发人员的常见错误

1+

rxjs的常见错误

作为开发人员,我在RXJS的角度下处于中级。我的经验与rxjava和rxjs有角度。在这个博客中,我已经发布了一个 RXJS核心的崩溃课程.

照顾rxjs开发人员的常见错误
RXJS开发人员的常见错误

今天,当我们与RXJS合作时,我将分享一些常见的错误。作为开发人员,本文对您有所帮助。让’开始了这个教程。

使用取消订阅

我和许多人对这个主题的长度谈过,但这仍然是我通常看到的最常见的错误—即,没有从流中取消订阅 当然.

这有各种后果,例如:

  • 导致内存泄漏
  • 它导致不必要的回调
  • 可能,导致您的应用程序中的严重错误

取消订阅可观察者的最佳和最优雅的方法是使用在组件被销毁时发出值的主题。

或者,您可以使用订阅将组件上的类属性维护,并在销毁组件时取消订阅。

It’非常重要,唐’t forget.

忽略初始值

这相当常见于角度形式。假设您订阅了预期获得该价值的流—但你永远不会得到一个。那有可能吗?

好吧— sometimes it’由流不是通过初始值初始化的事实引起的,并且从未派出事件。

这里’具有角度的常见场景’s forms:

除非用户更改 姓名formcontrol.以某种方式,永远不会调用回调。但—我们确实希望订阅使用初始值来发射 Formgroup. (许多人都希望它这样做)。

在这种情况下,我们需要使用操作员推送初始值 从...开始:


在这种情况下,我们将使用表格的初始值收到发射,并在此之后发出的所有变化。

选择错误的运营商

那里有很多运营商—而且你当然不是’T需要了解它们所有,您需要确保您了解您正在使用的每个人的详细信息。

小差异可能会产生很大的后果。

示例:mergemap vs switchmap

最常用的运营商之一是 mergeMap。该操作员允许您平整内部可观察并将保持每个事件的许多活动流:这在某些情况下很好,而不是其他情况。

在许多情况下,您可能希望仅维护1个活动订阅。例如,如果您有一个事件调用HTTP端点的事件,则可能希望取消传出请求,只能调用最新的请求:在这种情况下,您’我会更好 switchMap.

如果你’re not careful, mergeMap 可能会导致重复和不需要的订阅 switchMap can lead to 种族条件。最终,两者都可能导致错误和代码故障。

选择错误的运营商
选择错误的运营商

这是许多人的一个例子,有时是微小的,使RXJS运营商的差异。

正如我上面所说的那样—您不需要知道每个RX运算符。但是,你需要了解你的小特色’重新使用和比较与其他其他人相比,以了解哪一个适合您的案例。

您应该了解的其他显着差异:

  • zip vs forkjoin与combinelatest vs比赛
  • 合并vs combinelatest.
  • 定时器VS间隔
  • 永远不会vs空
  • VS来自
  • 缓冲vs窗口

注意:如果您希望将任何其他比较详细说明,请在下面发表评论。

使用错误的主题类型

另一个重要的错误不是为了不选择您的任务的错误类型的主题。

受试者是一种特殊类型的可观察到,允许您在流中推动值并通过订阅它来检索它们。虽然正常 Subject 可能涵盖大多数情况,你应该意识到的略有差异。

延迟用户

一个常见场景是当您的主题在观察者订阅其更改之前发出事件时。如果你’重新期待您的订阅者收到数据’失去运气:它赢了’t.

在这种情况下,你应该选择一个 ReplaySubject,它能够重播它收到的所有事件也是延迟用户。当您只想通过定义其缓冲区大小,您只想将最新的值保存在内存中的最新值时,它也特别有用。

另一种选择是 BehaviorSubject —而是需要一个值以便定义。

订阅回调内的势在必行逻辑

关于RXJS的最大事情之一是结合运营商并重新使用他们的逻辑是一种令人难以置信的(且简单的)方式来构建可重用的代码位。

写入RX代码的许多好处结束了一旦订阅了一个可观察到的:我们在订阅回调中写入的逻辑不是Rx-Land’在我们的代码中的FRP结束的开始。

当然,我不是说你永远不会订阅,但我的建议是将逻辑保持在订阅回调中尽可能小—无论您身在何处,避免直接订阅(例如,使用Angular async pipe).

在订阅中使用逻辑的缺点是什么?

有限的可重用性

RXJS流是丢失的,这意味着它们可以组合和扩展,因此重复使用。

您在订阅中订阅和执行逻辑的任何时间,您都会带走一些逻辑,它可以卸载到RX运算符:

如您所见,创建中间流或将逻辑卸载到单独的运算符,是一种在应用程序中重用逻辑的令人敬畏的方式。

根据经验:

  • 请勿检查订阅中的值是真实的,您可以轻松处理操作员 过滤器(布尔值)
  • 大学教师’t转换订阅中的数据
  • 副作用:例如,显示/隐藏装载图标,可以使用 tap or/and the finalize operators

较少的宣言

让’s查看命令和声明性代码段之间的一个例子:


现在,让我们’S转换上述声明性流:

说,唐’T忘记要订阅,否则,您的观察到将永远不会发出。

最后的话

RX是一个非常棒的库和一个可以帮助您轻松处理应用程序的复杂异步方面的工具。它’也很大,最常被误解。

确保您遵循上面的建议将至少确保您’重新照顾一个极其常见的错误原因,或者你花费几个月试图修复的虫子。

总之

  • 永远取消订阅
  • 大学教师’如果您期望一个,则省略初始值
  • 了解你的运营商’重新使用。小差异可能导致大错误。
  • 您应该使用正确类型的主题。
  • 将尽可能多的逻辑写入声明和在您的流中。此外,将逻辑与自定义运算符或中间流重用。

如果您需要任何澄清,或者如果您认为某些事情不清楚或错误,请留言!

1+
概括
照顾rxjs开发人员的常见错误
文章名
照顾rxjs开发人员的常见错误
描述
rxjs和今天的常见错误我会在与rxjs合作时分享一些常见的错误。作为开发人员,本文会有所帮助。
作者
出版商名称
Dasjs.
出版商标志