关于rxjs:从一个实际的例子触发理解什么是-Rxjs-的-defer-函数

38次阅读

共计 1329 个字符,预计需要花费 4 分钟才能阅读完成。

咱们在开发简单的 Angular 利用时,常常会应用到 Rxjs 的 defer 函数,例如:

创立一个 Observable,在订阅时调用 Observable 工厂为每个新的 Observer 创立一个 Observable 对象。

该函数接管一个输出参数,类型为一个工厂函数。输入为一个 Observable 对象,一旦被订阅时,其绑定的工厂函数会被调用。

defer 的本质是提早创立机制,即只有在返回的 Observable 被订阅时,才开始创立 Observable 对象。

defer 容许你只在 Observer 订阅时创立一个 Observable。它始终等到 Observer 订阅它,调用给定的工厂函数来获取一个 Observable —— 工厂函数通常会生成一个新的 Observable —— 并将 Observer 订阅到这个 Observable。如果工厂函数返回一个假值,则应用 EMPTY 作为 Observable 代替。最初但并非最不重要的是,工厂函数调用期间的异样通过调用 error 传递给观察者。

看上面这个具体的例子。

咱们来单步调试下下面这段代码。首先进入 defer 外部执行逻辑:

在 defer 外部,间接结构一个新的 Observable,并且将工厂函数传入。该工厂函数在第 8 行被调用,用于生成一个蕴含应用程序业务逻辑的 Observable 对象,存储在 input 里。最初,将应用程序的 subscriber 订阅到这个工厂函数返回的 Observable 上。

咱们再单步执行,发现程序执行流从上图的第 5 行,跳转到了 第 16 行。这体现了 defer 函数提早创立 Observable 对象的行为。所谓提早创立,精确的说,应该是提早了蕴含业务逻辑的 Observable 对象的创立。

紧接着,回到咱们的利用代码,此时针对 defer 函数返回的 wrapper Observable 对象调用 subscribe,这时候就会触发蕴含业务逻辑的 Observable 对象的创立了:

defer 返回的 wrapper Observable 的订阅函数在此处执行:

调用工厂办法,进行蕴含业务逻辑的 Observable 对象创立:

以后随机数执行后果大于 0.5, 返回 fromEvent 生成的新 Observable 对象。

紧接着,第 24 行的匿名函数 x => console.log(x),每当屏幕被鼠标点击时,就会触发。这个匿名函数原本是订阅到 defer 函数返回的 wrapper Observable 对象的。当工厂函数返回了新的 Observable 对象后,它被主动订阅到这个新的 Observable 对象上。

总结 defer 的工作原理:

(1) defer 函数被调用时,传入一个工厂函数作为输出参数。这个工厂函数返回一个新的蕴含了业务逻辑的 Observable 对象。

(2) defer 函数返回另一个新的 Observable 对象,这个 Observable 对象称为 wrapper 或者 dummy Observable 对象,因为它不蕴含任何业务逻辑,存活的惟一价值就是,实现业务逻辑 Observable 对象的提早创立。

(3) 当 wrapper Observable 被订阅时,触发工厂函数的执行,生成新的 Observable 对象,同时告诉其 Observer.

更多 Jerry 的原创文章,尽在:” 汪子熙 ”:

正文完
 0