Angular 6-简单易懂的英语解释

时间:2018-09-24 00:39:24

标签: angular observable

我正在寻找一个简单的英文解释,说明RXJS中的Observable是什么。

它可以用来做什么,以及任何有用的解释,例如视频链接,教程,用例,示例或任何其他内容。

到目前为止,我在Udemy,Todd Motto,Youtube和Angular官方网站上都找不到任何内容,如果可以的话,我只是想对上述内容进行基本解释。

到目前为止,我所知道的是您可以与观察员一起订阅它们。只是另一种变量吗?

谢谢。

4 个答案:

答案 0 :(得分:17)

让我们从承诺开始

在Javascript中,Promises是用于优雅处理异步代码的常见模式。如果您不知道诺言是什么,那就从那里开始。他们看起来像这样:

todoService.getTodos() // this could be any async workload
.then(todos => {
  // got returned todos
})
.catch(err => {
  // error happened
})

重要部分:

todoService.getTodos()

让我们暂时忘记getTodos()的工作方式。要知道的重要一点是,许多libraries支持Promises,并且可以为异步请求(如http请求)返回promise。

Promise对象implements有两种主要方法,可轻松处理异步工作的结果。这些方法是.then().catch()then处理“成功”的结果,而catch是一个错误处理程序。当then处理程序返回数据时,这称为resolving承诺,当它向catch处理程序抛出错误时,则称为rejecting

.then(todos => { // promise resolved with successful results })
.catch(err => { // promise rejected with an error }) 

最酷的是,thencatch还会返回承诺,因此您可以像这样链接

.then(todos => {
  return todos[0]; // get first todo
})
.then(firstTodo => {
  // got first todo!
})

这是要抓住的地方:承诺只能解决或拒绝一次

这对于诸如HTTP请求之类的事情都是可行的,因为HTTP请求从根本上执行一次并返回一次(成功或错误)。

当您想要一种优雅的方式异步数据时会发生什么?考虑视频,音频,实时排行榜数据,聊天室消息。能够使用promise设置一个处理程序,使其在流进来的同时继续接受数据,将是很棒的事情:

// impossible because promises only fire once!
videoService.streamVideo()
.then(videoChunk => { // new streaming chunk })

欢迎来到反应模式

简而言之:诺言是异步处理单个请求,而Observable则是异步处理流数据。

它看起来像这样:

videoService.getVideoStream() // returns observable, not promise
.subscribe(chunk => {  // subscribe to an observable
   // new chunk
}, err => {
  // error thrown
});

看起来类似于诺言模式吧?可观察的事物与应许之间的一大区别。可观察对象将数据“发射”到“订阅”中,而不是使用一次性.then().catch()处理程序。

Angular的http客户端库默认情况下返回observables,即使您可能认为http更适合一次性使用承诺模式。但是反应式编程(如rxJS)的好处是,您可以使其他事件(例如单击事件或任意事件流)成为可观察对象。然后,您可以将这些流组合在一起以完成一些非常酷的工作。

例如,如果您希望每次单击刷新按钮且每60秒刷新一些数据,则可以设置以下内容:

const refreshObservable = someService.refreshButtonClicked(); // observable for every time the refresh button gets clicked
const timerObservable = someService.secondsTimer(60); // observable to fire every 60 seconds

merge(
  refreshObservable,
  timerObservable
)
.pipe(
  refreshData()
)
.subscribe(data => // will keep firing with updated data! )

处理复杂过程的一种非常优雅的方法!响应式编程是一个非常大的话题,但是this是一个非常不错的工具,可以尝试并可视化可以使用可观察对象组成奇妙事物的所有有用方法。

注意:这是未经测试的伪代码,仅用于说明目的

答案 1 :(得分:2)

这就像一个事件,订阅时您说的是“让我知道发生这种情况的时间..” ..所以,假设您执行了一个http请求,但您实际上并不知道它需要多长时间,因此可观察的只是您可以订阅的占位符或事件,表示发生这种情况时,请执行某些操作。也就是说,当此http请求返回时,只要碰巧出现,就读取该值。您订阅的功能将在回来时运行。

答案 2 :(得分:2)

我对Observable的理解就像您问Siri(或其他东西)“明天天气如何”。 Siri将为您提供肯定的答案,并且Siri中包含答案的“项目”是“可观察的”。

下面的链接可能会有所帮助-使Rxjs可观察的神秘化

https://medium.com/@AnkurRatra/demystifying-rxjs-observable-467c52309ac

答案 3 :(得分:0)

为了笑,这个虚构的故事只供我这样的傻瓜理解:

经过7年的婚姻,出色的约翰仍然爱上了美丽的凯特,但凯特的女友们都告诉她要注意约翰,而约翰现在在办公室工作的时间越来越长。

“我会打电话给您,很忙,请继续处理。”因此,当凯特打电话给丈夫约翰(John)时,她总是听到 CALLBACK 。她大部分时间都感到满意,偶尔也感到抱歉。尽管有时候跟踪事情并不容易。

John喜欢Kate,他通过说“我 PROMISE (做Kate要求的一切)”来增强措词和处理方式! 之后大部分时间,凯特都很高兴,她建立了一个安全网来捕获意外响应,这是一种比回调更好的组织方式。

凯特(Kate)对约翰非常满意,但她的女友仍然对此闲话,特别是技术在进步。所以他们都告诉凯特,“你最好观察...”约翰现在对凯特来说可观察,凯特对亲爱的她开玩笑说她对他说,这意味着约翰可以现在响应不断,响应可以串流! Yulp而不是每个请求一个响应,而是在桌子上安装了一个小摄像头,以使她始终保持最新状态。例如,凯特(Kate)关心自己的饮食,他会说“蜂蜜,我只是吃了一块芝士蛋糕和一个苹果作为早餐”,...“蜂蜜,我从...吃了美味的午餐。” >

END