ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

RxJS 系列 – 概念篇

2022-07-27 02:00:13  阅读:198  来源: 互联网

标签:... 系列 name JS 概念 RxJS 变化 复习


前言

很长一段时间没有写 Angular 了 (哎...全栈的命), 近期计划又要开始回去写了. 于是就开始做复习咯.

我的复习是从 JS > TS > RxJS > Angular, 与此同时当然是顺便写一系列半教程半复习的文章咯, 我当年写了许多 Angular 的学习笔记, 只是文笔太烂, 这次得好好写了.

JS 已经复习到七七八八了, TS 老是提不起劲去写, 所以就改成边写 TS 边写 RxJS 吧.

 

以前写过相关的文章:

angular2 学习笔记 ( Rxjs, Promise, Async/Await 的区别 )

angular2 学习笔记 ( rxjs 流 )

 

什么是流 (stream) ?

RxJS 参杂了许多概念, 什么函数式, 观察者, 异步等等...

但我个人觉得最容易理解的部分是 stream 流.

流是什么? 它表示一个时间内一个变化的状态.

在 JS 里, 状态可以被理解为某个值, variable 的值.

时间则是用户使用 App 的时间.

看例子吧:

上图 (gif) 大概是 5 秒钟, 这个就是时间. 在这 5 秒中里面, 价钱 (值) 变化了好几次 (160, 190, 200, 250) 

一个有时间, 有变化的值就可以了解为一个流.

 

Why Stream? Because... 管理

为什么要用 "流" 的概念去理解这些 "值" ? 我不能简单的理解为 "点击" > "更新 value" ?

当然可以, 其实流的概念并不是为了理解, 而是为了管理.

当程序里出现越来越多, 变来变去的值以后, 出现 bug 的几率就越来越高, 而追踪 bug 也越来越吃力. 

所以就必须整一套概念来管理它们. 这就好比你用 Redux 来管理 React 的 state 一样.

以前有许多人拿 redux 去管理简单的程序, 结果就是大材小用, 反而是 redux 本身增加了整个系统的复杂度...幸好后来出现了 hook 才把这群人拉了出来...(永远记得, 软件开发一定要看清楚当前项目需求, 选择合适的方案而不是最牛逼的方案)

 

观察者模式

上面提到了, stream 的其中一个特色就是变化. 一个东西变化了那么依赖它的东西通常也会跟着变化. 蝴蝶效应...

我们在写 Excel 的时候经常会写这样的逻辑 cell

 

full name 这个值, 来自 first name + ' ' + last name

而每当 first name 或 last name 变化以后, full name 也随之变化. 

在上面这个例子里, first name, last name 就是流. 随着时间它会发生变化.

而 full name 算是一个 depend and 加工流. 它也会变化, 同时它依赖其它的流和一些而外的处理逻辑. 

用 RxJS 来表达这类型的场景会非常贴切.

 

标签:...,系列,name,JS,概念,RxJS,变化,复习
来源: https://www.cnblogs.com/keatkeat/p/16523249.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有