RxJS API解析（二）

chanthuang 发布于2019-08-22 11:00 / 3379人阅读

摘要：当无法匹配时，该对象被默认返回。如果没有明确指定，将返回附加了指定的对象。返回值返回值为经过选择后的可观察对象。题外话键值对，可以对值进行命名。键值对是对象的组成部分，键名可以方便进行查找和比较操作。

Rx* (Observable.case)方法 方法定义

[Rx.Observable.case(selector, sources, [elseSource|scheduler])]

作用

选择序列中特定可观察对象进行订阅，在特定可观察对象不存在的情况下，返回传入的默认可观察对象。

参数

selector (Function): 返回键的字符串的函数，键用以与sources中的键名进行比较。

sources (Object): 一个包含可观察对象的Javascript对象。

[elseSource|scheduler] (Observable | Scheduler):当selector无法匹配sources时，该对象被默认返回。如果没有明确指定，将返回附加了指定scheduler的Rx.Observabe.empty 对象。

返回值

(Observable): 返回值为经过选择后的Observable（可观察对象）。

宝珠图

实例

var sources = {
  hello: Rx.Observable.just("clx"),
  world: Rx.Observable.just("wxq") 
};
var subscription = Rx.Observable.case(()=>"hello", sources, Rx.Observable.empty())

subscription.subscribe(function(x) {
  console.log(x)
})

实例中，匿名函数()=>"hello"指定需要在sources中返回的可观察对象的键名为"hello"，命令行最终输出"clx"，点击进入case()实例。

题外话

键值对，可以对值进行命名。通过键值对可以构造命名的observable可观察对象。

键值对是Javascript对象的组成部分，键名可以方便进行查找和比较操作。

两个典型的使用场景中，数据都是用键值对表示的：通过Ajax请求获得的数据，就是一个键值对（JSON"对象）；许多配置文件也是键值对写入并持久化的，比如数据库、缓存的配置。

典型的Ajax请求结果

{
    message: "ok",
    nu: "350430378480",
    companytype: "huitongkuaidi",
    ischeck: "1",
    com: "huitongkuaidi",
    updatetime: "2016-01-15 10:58:19",
    status: "200",
    condition: "F00",
    codenumber: "350430378480"
}

Laravel 的数据库配置

"mysql" => [
    "read" => [
        "host" => "127.0.0.1",
    ],
    "write" => [
        "host" => "127.0.0.1"
    ],
    "driver"    => "mysql",
    "database"  => "homestead",
    "username"  => env("DB_USERNAME", "root"),
    "password"  => env("DB_PASSWORD", ""),
    "charset"   => "utf8",
    "collation" => "utf8_general_ci",
    "prefix"    => "",
    "strict"    => false,
]

试想，我们从不同的其他服务器获取配置文件，那么整个获取配置的过程是异步的。

我们将获取的结果封装成可观察对象，再命名为如database这样名称的键值对，使用case()方法便可以在可观察对象发射时，执行相应的初始化操作。

var config = {
    "database": Observable.return("数据库配置"),
    "cache": Observable.return("缓存配置"),
    "picCDN": Observable.return("图片CDN配置，比如七牛")
};
Observable.case(()=>"database", config, Observable.empty())
    .subscribe((databaseConfig) => {
        // 连接数据库
    })
Observable.case(()=>"picCDN", config, Observable.empty())
    .subscribe((pciCDNConfig) => {
        // 初始化图片CDN
    })

把上面的例子分开写也没有什么问题：

Observable.return("数据库配置")
    .subscribe(function(databaseConfig) {
        // 链接数据库
    })

Observable.return("图片CDN配置，比如七牛")
    .subscribe(function(picCDNConfig) {
        // 初始化图片CDN
    })

我们为何要多此一举去使用case()呢？从结构化去考虑，将所有从远程获取配置的过程封装成config对象更有实际意义，也更便于代码的维护和管理。

我们再看一个例子作为结束：例子是针对表单进行校验，校验用户的手机号和邮箱是否和服务器记录重复，将所有校验封装在validate对象中结构更为合理：

var validate = {
    "mobile": Observable.return("123-566-789-01"),
    "email": Observable.return("JonSnow@company.com")
};
var emptyObserable = Observable.empty();
validate.case(()=>"mobile", validate, empty)
    .subscribe(function(mobile){
        // 验证手机号码是否重复
    })
validate.case(()=>"email", validate, empty)
    .subscribe(function(email){
        // 验证用户邮箱是否重复
    })

剧终

专线服务私有云 RxJS 引入rxjs 云解析api Rxjs_Subject

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/91597.html

RxJS API解析（一）

摘要：选择后，仅有联通的可观察对象会被观察到。从外部看，所有订阅者仅能观测到这个联通了支流。，其中表示输入流，是操作符，是最后的输出流。截图验证一下当一个流被联通后，其他的流肿么办先记住结论未被选择的流将被调用方法，也就是说，他们被终止了。起因在SegmentFault里发布过一篇RxJS的简明教程，很多人反馈对这个主题很是很感兴趣，详见RxJS简明教程。 Rx 是一种编程的思维，而不是...

姘搁『 2019-08-19 17:23 评论0 收藏0
RxJS API解析（四）

摘要：任何程序设计语言在讲解递归特性时，基本都会举汉诺塔斐波拉契数列的例子。没错，请你对比一下斐波拉契数列和定义的相似之处递归完成后产生值的过程就是的过程。 Rx*(Observable.combineLatest)方法方法定义 Rx.Observable.combineLatest(...args, [resultSelector]) 作用通过处理函数总是将指定的可观察对象序列中最新发...

cheng10 2019-08-19 17:28 评论0 收藏0
RxJS API解析（三）

摘要：题外话服务可用性是指，服务提供者需要保证服务在任何时间情况下正确地提供。然后服务提供者，会将验证码发送到用户手机。 Rx* (Observable.catch)方法方法定义 Rx.Observable.catch(...args) 作用序列中可观察对象因为异常而被终止后，继续订阅序列中的其他可观察对象。参数 args (Array | arguments): 可观察对象序列。返...

banana_pi 2019-08-19 17:25 评论0 收藏0
Rxjs 响应式编程-第二章：序列的深入研究

摘要：接下来，我们将实现一个真实的应用程序，显示几乎实时发生的地震。得到的由表示，其中包含和的合并元素。如果不同同时传出元素，合并序列中这些元素的顺序是随机的。是操作序列的强大操作符。但是的方法仍在运行，表明取消并不会取消关联的。 Rxjs 响应式编程-第一章：响应式Rxjs 响应式编程-第二章：序列的深入研究Rxjs 响应式编程-第三章: 构建并发程序Rxjs 响应式编程-第四章构建完整...

姘搁『 2019-08-23 10:55 评论0 收藏0
【响应式编程的思维艺术】（5）Angular中Rxjs的应用示例

摘要：本文是响应式编程第四章构建完整的应用程序这篇文章的学习笔记。涉及的运算符每隔指定时间将流中的数据以数组形式推送出去。中提供了一种叫做异步管道的模板语法，可以直接在的微语法中使用可观测对象示例五一点建议一定要好好读官方文档。本文是【Rxjs 响应式编程-第四章构建完整的Web应用程序】这篇文章的学习笔记。示例代码托管在：http://www.github.com/dashnoword...

shenhualong 2019-08-26 18:35 评论0 收藏0