Angular7入门辅助教程(五)——Observable(可观察对象)

本文是Angular7入门教程的一部分,详细介绍了Observable的概念,包括其与Promise的区别、创建方式、Observer对象、异步消息发送及使用RxJS操作符等。通过实例代码帮助读者掌握如何在Angular中使用RxJS库处理HTTP请求。
摘要由CSDN通过智能技术生成

如果有任何的非技术障碍,比如如何新建Angular项目,请先到我的"Angular7入门辅助教程"专栏参考这篇博客:Angular7入门辅助教程——前篇

Observable

在开始讲服务之前,我们先来看一下一个新东西——Observable(可观察对象),是属于RxJS库里面的一个对象,可以用来处理异步事件,例如HTTP请求(实际上,在Angular中,所有的HTTP请求返回的都是Observable),或许,你以前接触过一个叫promise的东西,它们本质上面是相同的:都是生产者主动向消费者“push”产品,而消费者是被动接收的,但是他们两者还是有很大区别的:Observable可以发送任意多值,并且,在被订阅之前,它是不会执行的!这是promise不具备的特点,下面砸门来详细了解一下Observable

心法篇

  • Observable用于在发送方和接收方之间传输消息,为了更好地理解,你可以将这些消息看成是
  • 在创建Observable对象时,需要传入一个函数作为构造函数的参数,这个函数叫订阅者函数,这个函数也就是生产者向消费者推送消息的地方
  • 在被消费者subscribe(订阅)之前,订阅者函数不会被执行,直到subscribe()函数被调用,该函数返回一个subscription对象,里面有一个unsubscribe()函数,消费者可以随时拒绝消息的接收!
  • subscribe()函数接收一个observer(观察者)对象作为入参
  • 消息的发送可以是同步的,也可以是异步
  • 我们可以使用一系列的RxJS操作符,在这些消息被接收方接收之前,对它们进行一系列的处理、转换,因为这些操作符都是纯函数没有副作用,可以放心使用,并不会产生期望之外的结果!

详细教程篇

1、observer(观察者)

有了可观察对象(发送方),怎么少得了observer(观察者)来观察可观察对象呢!observer是一个对象,其中包含三个属性:next,error,complete,它们都是函数

  • next:以接收的值作为入参,在正常情况下执行,可选
  • error:出错的情况下执行,可选
  • complete:传输完成的情况下执行,可选

当然,这都是由你自己代码决定的,(请继续往下阅读你就会明白)

2、初识Observable

我们先通过RxJS库中的(of)方法来创建一个Observable,而不是通过构造函数来创建(下一小节的内容)

在vscode中新建项目(文件夹),取名testRxJS,在该目录下新建一个.ts文件,取名teaching1.0.ts,

评论 15
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值