使用Subject 和Observable 之间有什么区别,各自的用途是什么?

2024-03-29

我了解了制作 Observable 的两种不同方法。第一个是一个主题,如下所示:

// file A
const message$ = new Subject();

// file B
message$.subscribe( (message) => console.log(message) );

// file C
message$.next("Hello there!");

这种创建 Observable 的方法使我能够将数据从文件 B 交换到文件 C。

第二种方法是通过 Observable 类,如下所示:

// file A
const click$ = new Observable( function(observer) { 
  //Alternatively, I can use Observable.create()
  document.addEventListener('click', (e) => observer.next(e));
});

// file B
click$.subscribe( (cl) => console.log(cl) );

我可以收集到的Subject 方式和Observable 方式之间的主要区别是,我不确定如何在某个文件C 与Observable 的订阅者之间进行某种通信。基本上,click$ 没有.next()方法,观察者方法位于我们传递给可观察对象的函数中。

除了行为上的差异之外,用Subject创建的observable和用Observable创建的observable之间还有其他区别吗?


A Subject既是Observable and Observer同时。这使得它很容易使用,因为你得到了对Observer您可以在代码中传递并从您想要的任何地方发出项目。然而,当您从 Observable 的声明式定义切换到命令式定义时,这会大大增加代码的错误倾向。

一般来说,你应该使用 Observable 创建函数(of https://www.learnrxjs.io/operators/creation/of.html, from https://www.learnrxjs.io/operators/creation/from.html, create https://www.learnrxjs.io/operators/creation/create.html)只要有可能。我想说大多数情况都可以在没有主题的情况下解决。不过,有一个陡峭的学习曲线,因为您必须了解大多数可观察的创建函数才能遵循该模式。

对于习惯于命令式编码(即使用像 JS 这样的脚本语言)的开发人员来说,Subject 可能会更自然,因为它有点类似于回调函数的简单包装对象。有人可能会问,如果不合需要,为什么还要有一个主题。

根据这个article http://davesexton.com/blog/post/To-Use-Subject-Or-Not-To-Use-Subject.aspx, 主题仅在一种情况下使用:

强制且有状态地生成热可观察对象,无需任何直接的外部源。

简而言之,这意味着:当您没有任何外部源(例如 Observable、Promise 或 Event)并且需要从函数内部多播类的状态时,请使用主题。不过,您不应该将该主题暴露给其他人!

我建议你读一下这篇文章,它会让你明白一些事情。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用Subject 和Observable 之间有什么区别,各自的用途是什么? 的相关文章

  • 将 OoXml 插入单词抛出错误:未知

    我一直在尝试通过office js将OOXML插入到word文档的正文内容中insertOoXML 方法 我什至尝试过最简单的实现 认为我在尝试替换 XML 本身中的 fieldCodes 时做了一些不正确的事情 所有结果都是这样Error
  • JavaScript onTouch 不工作

    谁能告诉我为什么这个 onTouch 处理程序没有触发 var myDiv document getElementById existingContent var myButton a href log out a myDiv append
  • 在 javascript/jquery 中将光标更改为等待

    当调用函数时 如何让光标更改为此加载图标以及如何将其更改回 javascript jquery 中的普通光标 在你的 jQuery 中使用 body css cursor progress 然后又恢复正常 body css cursor d
  • 如何测试 javascript 闭包内的函数

    这似乎是不可能的 也可能是 但我正在尝试更多的 TDD 但我总是在闭包方面碰壁 假设我有以下内容 function createSomething init function privateMethod param return init
  • 每 3 秒重复一次动画

    我正在使用 WOW js 和 animate css 现在我正在将 CSS 运行到 Infinite 我想知道如何让我的课程运行 3 秒停止并再次开始到无限 My html img src images fork png class for
  • Web 串行 API - 未捕获(承诺中)DOMException:无法打开串行端口/所需成员 baudRate 未定义

    下面的代码可以在我的 Xubuntu 机器上运行 但现在我在 Kubuntu 上 它不再工作了 它不会打开端口 Arduino IDE 工作正常 可以向开发板写入代码 并且我可以在 Chrome 中选择设备 Arduino Uno 但当我尝
  • 在 Vue.js 中从父组件执行子方法

    目前 我有一个 Vue js 组件 其中包含其他组件的列表 我知道使用 vue 的常见方式是将数据传递给孩子 并从孩子向父母发出事件 但是 在这种情况下 我想在子组件中的按钮出现时执行子组件中的方法 parent被点击 哪种方法最好 一种建
  • jQuery AJAX 调用 Java 方法

    使用 jQuery AJAX 我们可以调用特定的 JAVA 方法 例如从 Action 类 该 Java 方法返回的数据将用于填充一些 HTML 代码 请告诉我是否可以使用 jQuery 轻松完成此操作 就像在 DWR 中一样 此外 对于
  • 使用 jQuery/JS 打开时使
    标签的内容具有动画效果

    我只想要 HTML5 的内容details标记为 滑行 动画打开 而不是仅仅弹出打开 立即出现 这可以用 jQuery Javascript 实现吗 Fiddle http jsfiddle net 9h4Hq HTML
  • 使用 Angular 下载具有动态 src 的脚本

    Angular 提供了通过动态名称动态加载模板的方法ng include 该部分中的内联 JS 和 CSS 可以正常加载 但没有一个好的方法来下载带有动态 url 的脚本 我们需要下载脚本 相对于调用它们的 html 部分的路径 即我们有一
  • Google App Engine:修改云运行环境

    我正在尝试部署一个使用自定义 Node js 服务器的 Next js 应用程序 我想将自定义构建变量注入应用程序 next config js const NODE ENV process env NODE ENV const envTy
  • 标签获取 href 值

    我有以下 html div class threeimages a img alt Australia src Images Services 20button tcm7 9688 gif a div class text h2 a hre
  • JavaScript 重定向到新窗口

    我有以下代码 它根据下拉列表的值重定向到页面 我如何使其在新窗口中打开 function goto form var index form select selectedIndex if form select options index
  • 如何将 Google Charts 与 Vue.js 库一起使用?

    我正在尝试使用 Vue js 库使用 Google Charts 制作图表 但我不知道如何添加到 div 这是我尝试做的 这是如何使用普通 javascript 添加图表 这是文档的代码示例 https developers google
  • MVC 在布局代码之前执行视图代码并破坏我的脚本顺序

    我正在尝试将所有 javascript 包含内容移至页面底部 我正在将 MVC 与 Razor 一起使用 我编写了一个辅助方法来注册脚本 它按注册顺序保留脚本 并排除重复的内容 Html RegisterScript scripts som
  • 为什么 jquery 没有检测到单选按钮未被选中的情况? [复制]

    这个问题在这里已经有答案了 可能的重复 JQuery radioButton change 在取消选择期间不会触发 https stackoverflow com questions 5176803 jquery radiobutton c
  • 如何获取浏览器视口中当前显示的内容

    如何获取当前正在显示长文档的哪一部分的指示 例如 如果我的 html 包含 1 000 行 1 2 3 9991000 并且用户位于显示第 500 行的中间附近 那么我想得到 500 n501 n502 或类似的内容 显然 大多数场景都会比
  • 在 React.js 中编辑丰富的数据结构

    我正在尝试为数据结构创建一个简单的基于网格的编辑器 但我在使用 React js 时遇到了一些概念问题 他们的文档对此没有太大帮助 所以我希望这里有人可以提供帮助 首先 将状态从外部组件传输到内部组件的正确方法是什么 是否有可能将内部组件中
  • 使用 Ajax 请求作为源数据的 Jquery 自动完成搜索

    我想做的事 我想使用 jquery 自动完成函数创建一个输入文本字段 该函数从跨域curl 请求获取源数据 结果应该与此示例完全相同 CSS 在这里并不重要 http abload de img jquerydblf5 png http a
  • Angular 6 + RxJS 6.0:如何将新元素推送到 Observable 包含的数组

    我从 firebase 服务器分块接收数据 同时渲染该数据需要一个坚持可观察包含数组的库 我不知何故无法将新的数据块推送到可观察到的现有数据块数组 从数据服务中 我通过主题的下一个调用并尝试添加新的 calEvent this homeWo

随机推荐