首页 > TAG信息列表 > rxjs

网址大全

rxjd https://rxjs-dev.firebaseapp.com/ https://github.com/ReactiveX/RxJS https://hub.fastgit.xyz/RxJS-CN/RxJS-Docs-CN nodejs https://nodejs.org/zh-cn/download/releases/ https://nodejs.org/zh-cn/download/ docker hub https://hub.docker.com/ w3school

RxJS 系列 – 概念篇

前言 很长一段时间没有写 Angular 了 (哎...全栈的命), 近期计划又要开始回去写了. 于是就开始做复习咯. 我的复习是从 JS > TS > RxJS > Angular, 与此同时当然是顺便写一系列半教程半复习的文章咯, 我当年写了许多 Angular 的学习笔记, 只是文笔太烂, 这次得好好写了. JS 已经复

第一个 rxjs 例子

我一直觉得, 用最少的代码实现功能是非常酷的. 如果能把少写代码与逻辑清晰结合起来, 那就是再酷不过了. 因此想记住各种常用库的方法, 尽量使用起来, 减少代码量. 这也是我学他们的主要原因. 事件监听的惯常做法是这样的: document.addEventListener("click", () => { console.

RXJS 5.5以上finally()转变为finalize()

RXJS 5.5以下判断方法执行完毕的回调写法： 1 this.saving = true; 2 this.service.createData(this.data) 3 .finally(() => { 4 this.saving = false; 5 }) 6 .subscribe((data) => { 7 this.notify.success(this.l('保存成功'

rxjs Observable 设计原理背后的 Pull 和 Push 思路

Observables 顾名思义，是可以被观察的事务。在 Rxjs 的上下文里，Observable 会随着时间的推移，在某个时间点产生数据。 Observables 可以： 不停地（永远）产生值，比如 interval 操作符。 可以一次性生产价值，然后进入 complete 状态。 可能会产生错误，然后进入 complete 状态。 Observable

rxjs Observable 两大类操作符简介

Observable 生产的数据，应该提供开发人员足够的自由度，对这些数据进行各种处理，比如 map / transform 等等。这就是 Rxjs Operator 大展身手的地方。 运算符是对 Observable 进行操作并返回 Observable 的函数。 这允许我们链接这些运算符。 链中的每个运算符都会修改由前一个运算符

rxjs Observable of 操作符的单步调试分析

看这段最简单的代码： import { Observable, of } from 'rxjs'; const observable = of(1, 2, 3); observable.subscribe((message) => { console.log(message); }); 输出： 输入的 1，2，3 被当成数组处理，触发 fromArray 函数调用： 因为不存在 scheduler 调用，所以进入 subscribeT

rxjs Observable 自定义 Operator 的开发技巧

操作符是 RxJS 库和 Observables 的基础块。 它使我们能够通过使用一些关键字（函数）来执行复杂的操作。 运算符只不过是获取源 Observable、对其执行操作并返回新 Observable 的函数。 rxJS 的 管道运算符 pipe 允许我们链接运算符。每个运算符都接受一个 Observable 并返回一个 Obs

rxjs Observable filter Operator 的实现原理介绍

看下面这段使用 filter Operator 的代码： import { fromEvent, interval, MonoTypeOperatorFunction } from 'rxjs'; import { filter } from 'rxjs/operators'; function filterKey(key) { console.log('input: ', key); const result: MonoTypeOp

Rxjs TakeUntil 操作符的学习笔记

TakeUntil 的官方文档对这个操作符的解释是： Emit values until provided observable emits. 即它可以被赋予另一个起锚定作用的 Observable，当该锚定 Observable emit 值时，原始的 Observable 就停止发射值，进入 complete 操作。 看一个实际的例子： import { interval, timer } from

rxjs 里 CombineLatest 操作符的一个使用场景

一个具体的例子： combineLatest([ data$.pipe(startWith(null)), loading$, ]).pipe( takeWhile(([data, loading]) => !data || loading, true), map(([data, loading]) => loading ? null : data), skip(1), distinctUntilChanged(), ); 我们在这里使用巧妙的 takeW

rxjs 里 Skip 操作符的一个使用场景

skip 操作符允许我们忽略源的前 x 个排放。 当我们有一个始终在 subscription 上发出希望忽略的某些值的可观察对象时，就可以使用这个操作符。比如 Observable emit 的前几个值并不是我们感兴趣的值，另一种情况是我们订阅了 Replay 或 BehaviorSubject，并且不需要对初始值进行操作，而

Rxjs的常用概念

1. Rxjs的基本概念 Observable Observer Subscription Subject Operators Observer 就是实现该接口的一种对象 interface Observer<T> { void onCompleted(); void onError(java.lang.Throwable e); void onNext(T t); } 支持next和completed，类似于Promise

Promise与Rxjs的区别

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

使用 RxJs Observable 来避免 Angular 应用中的 Promise 使用

我们通过一个具体的例子来阐述。 考虑您正在构建一个搜索输入掩码，该掩码应在您键入时立即显示结果。 如果您曾经构建过这样的东西，那么您可能会意识到该任务带来的挑战。 不要在每次击键时都点击搜索端点 将搜索端点视为您按请求付费。不管它是不是你自己的硬件。我们不应该比需

rxjs: ReplaySubject

ReplaySubject 记录 Observable 执行中的历史值并将其回放给新的订阅者。 var subject = new Rx.ReplaySubject(3);  参数 表示缓存几个历史数据 假如参数是5, 也就是缓存5个值，订阅的时候可以收到过去发出的5个值。 官方文档：概览 | RxJS 中文文档

Rxjs----from

 from([**,**,**], scheduler?: SchedulerLike): Observable<T>  函数功能： 利用数组、或者 Promise、或者 iterable object，创建可观察对象 参数解析： 第一个参数传递数组、或者 Promise、或者 iterable object，第二个参数可选，默认为 undefined 返回结果：可观察对象 示例： co

使用rxjs和webRTC和vue实现视频流在本地网络上的传输Demo

为什么要写webRTC的demo 因为webRTC可以将流通过网络传输到另外一个地方来使用，如播放。 为什么要用rxjs 因为rxjs可以优雅的处理异步 这篇文章相对于MDN的教学文章有什么好的地方 1.用vue组件之间的通信来取代websocket的作用，大大较少了代码量，从而降低入门demo的难度 2.用r

RxJS+WebPack+TS实现组件间的松耦合

本文将介绍如何通过RxJS+TS实现模块间的松耦合。所谓松耦合是指模块间不能存在显示的引用关系。公司项目中经常看到junior程序员写出如下的代码： var moduleA = { foo: function() { moduleB.doSomeThing(); moduleC.doSomeThing(); } dummy: function() {} } var

cc 使用yarn

yarn init yarn add rxjs yarn add @apollo/client graphql import {ApolloClient, gql, InMemoryCache} from "@apollo/client"; import {ajax} from "rxjs/ajax"; import {map} from "rxjs"; class GraphqlClient { private stati

[RxJS] SwitchAll() - switch between two observables display always latest value

Converts a higher-order Observable into a first-order Observable producing values only from the most recent observable sequence import './style.css'; import { fromEvent, of, merge, empty, concat, defer } from 'rxjs'; import { dela

RxJS

最近在研究RxJS的编程思想，与OOP不同，RxJS更像是事件驱动+观察者模式，前一篇文章有所介绍。有经验的读者想必会有个疑问：Observable与Promise模式，或者说OOP到底区别在哪里，能带来什么不同呢？ 我的理解是(此处为个人理解)：Observable更好地实现了解耦。如同我们用消息队列在不同系统间传递

angular国际化 / rxjs使用技巧

设置 base href ng build --base-href "/" --prod async管道的用法 <ng-container *ngIf="num|async;let add;"> <h1>{{add}}</h1> </ng-container> num=of(1) 排除主题文件 angular.json <> "styles": [ "src/

rxjs 学习系列二(环境搭建)

环境搭建 npm i rxjs ts-loader typescripnpm init -ytsc --initmkdir srcmkdir disttouch webpack.config.jstouch src/index.tstouch src/index.html webpack -w code --install-extension webpack-snippets webpack.config.js配置内容 const path = require('path'); m

【Worktile】小知识点记录-Rxjs

1、更改store的数据最好使用setState，使用snapshot直接更改，虽然也可以更新store里的数据，但是其他的订阅者不会收到广播，会导致其他的订阅者无法接收到最新的数据