rxjs 和 promise

2024-09-04

angular2 学习笔记 ( Rxjs, Promise, Async/Await 的区别 )

Promise 是 ES 6 Async/Await 是 ES 7 Rxjs 是一个 js 库在使用 angular 时,你会经常看见这 3 个东西. 它们都和异步编程有关,有些情况下你会觉得用它们其中任何一个效果都一样. 但又觉得好像哪里不太对.... 这篇就来说说,我在开发时的应用方式. 在 Typescript 还没有支持 Async/Await 的时候, angular 就已经发布了. 那时我们只想着 Promise vs Rxjs 这 2 者其实很好选择, 因为 "可读性"

Angular学习笔记—Rxjs、Promise的区别

Promises: 异步操作完成或失败时处理单个事件不可取消代码可读性强,有try/catch Observables: 可持续监听和响应多个事件可取消订阅支持map, filter, reduce等通常情况下Observables优于Promises,但也有些情况需要使用Promises,比如不需要持续响应的情况下.

angular7 Rxjs 异步请求

Promise 和 RxJS 处理异步对比 Promise 处理异步: let promise = new Promise(resolve => { setTimeout(() => { resolve('---promise timeout---'); }, 2000); }); promise.then(value => console.log(value)); RxJS 处理异步 import {Observable} from 'rxjs'; let stream = new O

rxjs 简单的demo

开发环境是使用 create-react-app 创建的.再使用 $ cnpm install rxjs 来安装即可开始. $ npx create-react-app my-app $ cd my-app $ cnpm install rxjs $ npm start my-app/src/index.js ////////////////////////////////////////////// // demo1:入门 ///////////////////////////////////

RxJS入门

一.RxJS是什么? 官方文档使用了一句话总结RxJS: Think of RxJS as Lodash for events.那么Lodash主要解决了什么问题?Lodash主要集成了一系列关于数组.对象.字符串等集合操作,极大的方便了对这些集合数据进行衍生.举个简单的例子:求数组偶数元素的平方和 const { pipe, filter, map, reduce } = require('lodash/fp') const source = [0, 1, 2, 3, 4] const res

angular2 学习笔记 (Typescript)

1.接口奇葩验证 interface Abc { name : string } function abc(obj : Abc) { } let ttc = { name: "adad", age: 12 }; abc(ttc); //no error abc({ name: "adad", age: 12 }); //error 对象字面量会有特别的检查, 所以一个 no error ,一个 error. 2. readonly const data: strin

promise和Rxjs的一点区别

promise 代码 let promise = new Promise( (resolve) => { setTimeout(() => { resolve('chen'); },2000) }); promise.then((value) => { console.log(value); }) Rxjs代码 let start = new Observable( (observer) => { let timeOut = setTimeout( () => { obser

RxJS + Redux + React = Amazing!（译一）

今天,我将Youtube上的<RxJS + Redux + React = Amazing!>翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: https://www.youtube.com/watch?v=AslncyG8whg 开场白管理状态很困难,对吧?如果你写过复杂应用,你一定对此深恶痛绝.React社区还有Angular2社区和Ember社区现在都开始使用一个库,叫Redux.为什么?因为它让管理状态变得简单多了.但Redux有个问题,就是它对你写异步

RxJS + Redux + React = Amazing!（译二）

今天,我将Youtube上的<RxJS + Redux + React = Amazing!>的后半部分翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: https://www.youtube.com/watch?v=AslncyG8whg Observable 什么是Observable?让我们快速来了解一下它吧! Observable是一个由零个.一个或多个值组成的流.注意,是零个.一个或多个值.零个意味着可以没有值,这完全没问题.一个值的情况就像是Promi

[译]RxJS 5.X基础篇

欢迎指错与讨论 : ) 当前RxJS版本:5.0.0-beta.10.更详细的内容尽在RxJS官网http://reactivex.io/rxjs/manual/overview.html.文章比较长,可以通过快捷键 command+f 或者 ctrl+f 搜索主要内容. - 前言 RxJS在ng2.redux-observable或者前端数据层中扮演一个重要角色,因此笔者想学好RxJS,提前做好准备.本文95%非原创,而是笔者对RxJS官网基础篇的翻译,如有错漏请指出.本文主要内容:简介和六

学习RxJS：导入

原文地址:http://www.moye.me/2016/05/31/learning_rxjs_part_one_preliminary/ 引子新手们在异步编程里跌倒时,永远会有这么一个经典问题:怎么在一次异步调用里return一个结果啊? 老司机说要用回调函数,然后有条件判断的嵌套回调(回调地狱)问题来了: 老司机推荐用事件,然后异步流程里有顺序依赖: 老司机推荐用Promise,然后有顺序依赖的流程里,居然还想订阅事件: 老司机建议试试协程,谁知对方想要合并两个异步调用: …… 以上,是

[Reactive Programming] Async requests and responses in RxJS

We will learn how to perform network requests to a backend using RxJS Observables. A example of basic jquery request: console.clear(); var requestStream = Rx.Observable.just('https://api.github.com/users'); //Current requestStream is just a stream //

[RxJS + AngularJS] Sync Requests with RxJS and Angular

When you implement a search bar, the user can make several different queries in a row. With a Promise based implementation, the displayed result would be what the longest promise returns. This is the problem which we want to solve. <!DOCTYPE html> &

angular2 学习笔记 ( rxjs 流 )

RxJS 博大精深,看了好几篇文章都没有明白. 范围牵扯到了函数响应式开发去了... 我对函数式一知半解, 响应式更是第一次听到... 唉...不过日子还是得过...混着过先呗我目前所理解的很浅, 大致上是这样的概念. 1.某些场景下它比promise好用, 它善于过滤掉不关心的东西. 2.它是观察者模式 + 迭代器模式组成的 3.跟时间,事件, 变量有密切关系 4.世界上有一种东西叫 "流" stream, 一个流能表示了一段时间里,一样东西发生的变化. 比如有一个值, 它在某段时

[RxJS] Combining streams in RxJS

Source: Link We will looking some opreators for combining stream in RxJS: merge combineLatest withLatestFrom concat forkJoin flatMap / switchMap Merge: Observable.merge behaves like a "logical OR" to have your stream handle one interaction OR

使用angular的HttpClient搭配rxjs

一.原Http使用总结使用方法在根模块或核心模块引入HttpModule 即在AppModule或CoreModule中引入HttpModule: import { HttpModule } from '@angular/http'; @NgModule({ import: [ HttpModule ] // ... }) AppModule {} 在使用的地方注入Http服务 import { Http } from '@angular/http'; // ... constructor(

Promise小书（长文）

promise基础 Promise是异步编程的一种解决方案.ES6 Promise的规范来源于Promises/A+社区,它有很多版本的实现. Promise比传统的解决方案(回调函数和事件)更合理和更强大,可以避免回调地狱.使用Promise来统一处理异步操作,更具语义化.易于理解.有利维护. Promise接口的基本思想是让异步操作返回一个Promise对象,我们可以对这个对象进行一些操作. 三种状态和两种变化途径 Promise对象只有三种状态. 异步操作"未完成",promis

RxJS速成 (上)

What is RxJS? RxJS是ReactiveX编程理念的JavaScript版本.ReactiveX是一种针对异步数据流的编程.简单来说,它将一切数据,包括HTTP请求,DOM事件或者普通数据等包装成流的形式,然后用强大丰富的操作符对流进行处理,使你能以同步编程的方式处理异步数据,并组合不同的操作符来轻松优雅的实现你所需要的功能下面废话不说, 直接切入正题. 准备项目我使用typescript来介绍rxjs. 因为我主要是在angular项目里面用ts. 全局安装typescrip

一起来看 rxjs

更新日志 2018-05-26 校正 2016-12-03 第一版翻译过去你错过的 Reactive Programming 的简介你好奇于这名为Reactive Programming(反应式编程)的新事物, 更确切地说,你想了解它各种不同的实现(比如 [Rx*], [Bacon.js], RAC 以及其它各种各样的框架或库) 学习它比较困难, 因为比较缺好的学习材料(译者注: 原文写就时, RxJs 还在 v4 版本, 彼时社区对 RxJs 的探索还不够完善). 我在开始学习的时候, 试

Rxjs常用operators

本文使用的是angular6内置的rxjs,版本号为6.3.3 concat 通过顺序地发出多个 Observables 的值将它们连接起来,一个接一个的. 参数: 名称类型属性描述 other ObservableInput 等待被连接的 Observable. 可以接受多个输入 Observable. scheduler Scheduler 可选的,默认值: null 可选的调度器,控制每个输入 Observable 的订阅. const timer1 = interval(1000)

rxjs 和 promise

热门专题