web前端

rxjs-Observable和普通函数的区别

2020-12-01  本文已影响0人  姜治宇

rxjs是提供一种响应式编程的思路,可以减少代码耦合度,让代码看着更加优雅。
看如下这段代码:

    import {Observable } from 'rxjs';

    var ob = Observable.create((observer)=>{
      observer.next('hello');
    });

    ob.subscribe(v=>{
      console.log(v) // hello
    });

直观上感觉这是一个异步代码,因为涉及到发布和订阅。但实际上这段代码跟声明一个函数是差不多的功效:

function foo(){
  return 'hello';
}
foo();

但是吧,函数天生有些缺陷,怎么说呢?
比如,能让一个函数返回多个值吗?

function foo(){
  return 'hello';
  return 'world'; //永远执行不到
}
foo();

再比如,能让函数返回异步请求的信息吗?

function foo(){
  setTimeout(()=>{
    return 'hello';
  },1000);
}
foo();//拿不到异步信息

您瞧,函数还是能力有限哪~~
然鹅以上的痛点,用rxjs可以轻松搞定。

    import {Observable } from 'rxjs';
    var ob = Observable.create((observer)=>{
      observer.next('hello');
      observer.next('world');
      setTimeout(() => {
        observer.next({code:200,msg:'ok'}); // 异步执行
      }, 1000);
    });
    ob.subscribe(v=>{
      console.log(v);
      if(v.code === 200) {
        console.log(v.msg)
      }
    });

也就是说,Observable可以做到:
请给我任意数量的值,无论是同步还是异步。

上一篇下一篇

猜你喜欢

热点阅读