专业编程基础技术教程

网站首页 > 基础教程 正文

「1分钟——前端07」RxJS介绍(前端javascript)

ccvgpt 2024-07-29 13:23:46 基础教程 6 ℃

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

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

「1分钟——前端07」RxJS介绍(前端javascript)

可以把 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简单介绍

Tags:

最近发表
标签列表