RXJs
1、 Example
- 简单来说就是promise的加强版
这是个promise的用法
let promise = new Promise(resolve =>{
setTimeout(() => {
resolve('--promise timeout ---')
})
})
promise.then(
value=>console.log(value)
)
- Observable 的写法 相当于发散函数
let stream1 = new Observable(observer =>{
let timeout = setTimeout(()=> {
observer.next('ibservable timeout ')
},2000);
return ()=>{
clearTimeout(timeout)
}
})
let disposable = stream1.subscribe(value=>console.log(value));
2、不同点
1. 中间禁止
- promisem没办法中途禁止
- observer是可以中间禁止的
disposable.unsubscribe()
2 observer可以发射很多的值
- promise只能resolve一次，兑现一次就不能resolve了
- 但是observe可不断的next
3.observer 有很多的工具函数
- promise没有什么函数
- 如下的
// 因为会源源不断的发送，所以可以甄别
//进行过滤的函数
stream2.filter(val=>val%2==0)
.subscribe(val=>console.log("filter=>"+val))
//进行map的函数
//对每个值进行平方
stream2.map(val=>val*val)
.subscribe(val=>console.log("filter=>"+val))
underscore.js为我们扩展了很多的实用性工具函数/方法
同理，RxJs上边添加了很多的工具函数
3、应用的场景
//场景1 发送请求
public getPostList(searchText:string ,page:number=1) Observable<Post[]>{
let url = thie .postListURL;
let params = new URLSearchParams();//这里组织需要提交到后台的代码
if( searchText){
params.set("search",searchText);
url=this.postListUrL;
cosnole.log('searchText==${searchText}');
}
params.set("page",string(page));
return this.http
.get(url,{search:params})
.map((rse:Response)=>{
let result = res.json();
console.log(result);
return;
})
.catch((error:any)=>Observable.throw(error||'Server error '));
}
//如果是post请求的话
let data =new URLSearchParams();
data.append("email",user.email);
data.append("PASSWORD",user.OASSWIRD);
return this.http.post(this.userRegisterURL,data)
//场景2：事件处理
对每次按键发起请求
this.searchTextStrwam.debounceTime(500)//如果发现用户在一定时间内不在按键盘， 去抖动操作
.distinctUntilChange()//除非输入框输入的内容和上一次不一样，要不就不进行操作
.subscribe(searchText=>{
console.log(this.searchText);
})
详情请见 angular2的各种事件机制
