Rxjs 基础(1)
2019-02-14 本文已影响25人
zidea
简单定义是可以将 Rxjs 理解为异步的 loDash
现在 web 的 5 个特征
- AJAX
- 用户事件(单击、 鼠标移动、键盘事件等)
- 动画
- sockets
- workers(任务/作业)
回调
通常 javascript 会采用回调的方式来处理异步
getSomeData((data)=>{
console.log('接受数据',data);
});
回调问题顾名思义,是我们所谓 callback Hell 也有叫做金子塔什么来的。就是层层嵌套看起来不舒服,当然不仅仅是这些。
Promise 的出现可以让代码显得更清晰易懂
getSomeData(id)
.then(data)=>{
console.log('接受数据',data);
return getSomeData(data.parentId);
})
.then( data => {
doStuff(data);
return getSomeData(data.parentId);
});
Promises 的特性
- 不可取消
- 不可变(immutable)
- 一次性返回(单值)
- 缓存
promise 的有些特性也是 promise 的缺点和问题所在,列出一下两个问题
1. Promise 无法取消
我们经常在线看一些视频,当我们找到一个想看的视频然后打开这个视频,这时候就发起了一个 Promise 的请求,但是随后我们又发现一个更适合我们的视频,随后我们就打开了新的视频以收看,这时候就又发起一个 promise,由于 promise 是无法取消的所有前一个 promise 还在进行,这样无形中就占用了我们的网络资源。
我们需要一个类型是一个可以取消的异步
Promises 只能一次性返回单值
- AJAX(适合单值)
- 用户事件(单击、 鼠标移动、键盘事件等)
- 动画
需要时时更新动画的状态 - sockets
- workers(作业/任务)
我们需要的类型是可以异步返回一个 iterable
Iterable
- iterable.iterator() 获取 iterator
- iterator.next() 获取结果
- result.value(): 返回值
- result.done 是否完成
- 在调用 iterator.next() 时可能会抛出一个错误
const iterator = iterable.iterator();
while(true){
try {
let result = iterator.next();
} catch (error) {
handleError(err)
}
if(result.done){
break;
}
doSomething(result.value)
}