zoukankan      html  css  js  c++  java
  • Observable 和 Promise 的区别

    参考: promise-vs-observable

    1.observables 是lazy evaluation。

    比如下面的代码片段,对于promise,无论是否调用then,promise都会被立即执行;而observables却只是被创建,并不会执行,而只有在真正需要结果的时候,如这里的foreach,才会被执行。

    再举个例子,比如这里不是用setTimeout模拟异步操作,而是去请求一个url,那对于promise来说,then的作用是处理返回结果,而http请求在第一步就已经发送了;相反,对于observable来说,由于它发现你其实现在并不需要异步调用的结果,所以它干脆就不发送请求,而只有你真正需要响应数据的时候才会发送请求。

    var promise = new Promise((resolve) => {
    setTimeout(() => {
    resolve(42);
    }, 500);
    console.log("promise started");
    });

    //promise.then(x => console.log(x));

    var source = Rx.Observable.create((observe) => {
    setTimeout(() => {
    observe.onNext(42);
    }, 500);
    console.log("observable started");
    });

    //source.forEach(x => console.log(x));
    2.observables可以被cancel。

    observable能够在执行前或者执行过程中被cancel,或者叫做dispose。

    下面的例子中,observable在0.5秒的时候被dispose,所以日志“observable timeout hit”不会被打印。

    var promise = new Promise((resolve) => {
    setTimeout(() => {
    console.log("promise timeout hit")
    resolve(42);
    }, 1000);
    console.log("promise started");
    });

    promise.then(x => console.log(x));

    var source = Rx.Observable.create((observe) => {
    id = setTimeout(() => {
    console.log("observable timeout hit")
    observe.onNext(42);
    }, 1000);
    console.log("observable started");

    return () => {
    console.log("dispose called");
    clearTimeout(id);
    }
    });

    var disposable = source.forEach(x => console.log(x));

    setTimeout(() => {
    disposable.dispose();
    }, 500);
    3.observable可以retry,或者多次调用。

    上面的代码,可以拿到promise和observable的变量。对于promise,不论在后面怎么调用then,实际上的异步操作只会被执行一次,多次调用没有效果;但是对于observable,多次调用forEach或者使用retry方法,能够触发多次异步操作。

    4.observable可以进行组合变换。

    observable可以看做列表,可以进行各种组合变换,即LINQ操作,比如merge,zip,map,sum等等。这是observable相对于promise的一大优势。

  • 相关阅读:
    js控制表格隔行变色
    浅谈css的伪元素::after和::before
    CSS 背景色变化 结构化伪类的练习
    css清除浮动的几种方式,哪种最合适?
    怎么去检测浏览器支不支持html5和css3?
    display:flex 布局详解(2)
    css3弹性盒子display:flex
    Referer和空Referer
    不要懒惰,坚持每周总结一篇博客
    比较2个文件的不同处
  • 原文地址:https://www.cnblogs.com/ygunoil/p/15523556.html
Copyright © 2011-2022 走看看