美文网首页
「1分钟--前端07」RxJS介绍

「1分钟--前端07」RxJS介绍

作者: 悬笔e绝 | 来源:发表于2018-06-02 22:01 被阅读0次

RxJS 是一个函数式编程的库,它通过使用 observable 序列来编写异步和基于事件的程序。

它提供了一个核心类型 Observable,附属类型 (Observer、 Schedulers、 Subjects) 和受 [Array#extras] 启发的操作符 (map、filter、reduce、every, 等等),这些数组操作符可以把异步事件作为集合来处理。

可以把 RxJS 当做是用来处理事件的 Lodash 。


一. 特性

1.纯净性:

使用纯函数,将应用的状态单独隔离出来;

2.流动性:

延时,过滤等流程控制符,可轻松实现函数防抖和节流功能。

3.作为函数的泛化,解决了promise的几个不足

(1)promise在 new实例化时传入的fn是立即执行的,而且无法中断;

而RXjs中Observables是延迟执行,不“调用”它(使用 subscribe)是不会执行的。

订阅Observable类似调用函数

(2)promise的then回调是异步的;RXjs是同步的,像函数一样;


二. Observable和函数的区别

1.函数只能返回一个值

function foo() {
console.log('Hello');
return 42;

return 100; // 死代码,永远不会执行

}

2.Observables可以返回多个值

var foo = Rx.Observable.create(function (observer) {
console.log('Hello');
observer.next(42);
observer.next(100); // “返回”另外一个值
observer.next(200); // 还可以再“返回”值

});

console.log('before');

foo.subscribe(function (x) { console.log(x);

});

console.log('after');


同步输出:

"before"

"Hello"

42

100

200

"after"


3.总结:

func.call() 意思是 "同步地给我一个值"

observable.subscribe() 意思是 "给我任意数量的值,无论是同步还是异步"

以上,函数式编程库RxJS简单介绍

相关文章

  • Rxjs 的使用

    RxJS使用分: 前端Html 后端 前端使用方法 前端在Html中将RxJS作为普通Javascript库包引入...

  • 「1分钟--前端07」RxJS介绍

    RxJS 是一个函数式编程的库,它通过使用 observable 序列来编写异步和基于事件的程序。 它提供了一个核...

  • 30 天精通 RxJS (07): Observable Ope

    这是【30天精通 RxJS】的 07 篇,如果还没看过 06 篇可以往这边走:30 天精通 RxJS (06): ...

  • RxJS介绍

    什么是RxJS RxJS 是一个库,它通过使用 observable 序列来编写异步和基于事件的程序。它提供了一个...

  • RxJS 学习系列 资料推荐

    最近再做新项目,前端用到的是angular6,自然绕不开rxjs。可以把 RxJS 想成处理 非同步行为 的 Lo...

  • 了解rxjs

    rxjs适用于异步场景,可以用于优化前端交互中的请求、事件。 rxjs特点 统一异步编程的规范,不管是Promis...

  • 【翻译】介绍rxjs

    原文地址:https://gist.github.com/staltz/868e7e9bc2a7b8c1f754 ...

  • Rxjs的学习

    Rxjs是前端处理异步的一个很先进的技术,而且也比较让人费解,以下是一些学习资料: 1. Rxjs的官网,最权威的...

  • RxJS

    研究背景 最近使用的前端框架 Angular 2 将 RxJS 作为很重要的依赖。要掌握 Angular 2 看来...

  • Rxjs-01 介绍

    一、总结Rxjs 的Observable、Observer、Subscribe的关系 用途广泛: 可谓深入研究 舵...

网友评论

      本文标题:「1分钟--前端07」RxJS介绍

      本文链接:https://www.haomeiwen.com/subject/uckdsftx.html