Get a better understanding of the RxJS Observable by implementing one that's similar from the ground up.

class SafeObserver {
constructor(destination) {
this.destination = destination;
} next(value) {
const destination = this.destination;
if (destination.next && !this.isUnsubscribed) {
destination.next && destination.next(value);
}
} error(err) {
const destination = this.destination;
if (!this.isUnsubscribed) {
if (destination.error) {
destination.error(error);
}
this.unsubscribe();
}
} complete() {
const destination = this.destination;
if (!this.isUnsubscribed) {
if (destination.complete) {
destination.complete();
}
this.unsubscribe();
}
} unsubscribe() {
this.isUnsubscribed = true;
if (this._unsubscribe) {
this._unsubscribe();
}
}
} class Observable {
constructor(_subscribe) {
this._subscribe = _subscribe;
} subscribe(observer) {
const safeObserver = new SafeObserver(observer);
safeObserver._unsubscribe = this._subscribe(safeObserver);
return () => safeObserver.unsubscribe();
}
} const myObservable = new Observable((observer) => {
let i = 0;
const id = setInterval(() => {
if (i < 10) {
observer.next(i++);
} else {
observer.complete();
}
}, 100); return () => {
console.log('unsubbed');
clearInterval(id);
};
}); const observer = {
next(value) { console.log('next -> ' + value); },
error(err) { },
complete() { console.log('complete'); }
}; const foo = myObservable.subscribe(observer); foo.unsubscribe();

[RxJS] Creating Observable From Scratch的更多相关文章

  1. Angular学习笔记—RxJS与Observable(转载)

    1. Observable与观察者模式的关系 其实这里讲的Observable就是一种观察者模式,只不过RxJS把Observable结合了迭代模式以及附件了很多的operator,让他变得很强大,也 ...

  2. [rxjs] Creating An Observable with RxJS

    Create an observable var Observable = Rx.Observable; var source = Observable.create(function(observe ...

  3. [RxJS] Using Observable.create for fine-grained control

    Sometimes, the helper methods that RxJS ships with such as fromEvent, fromPromise etc don't always p ...

  4. ng-packagr 打包报错 Public property X of exported class has or is using name 'Observable' from external module “/rxjs/internal/Observable” but cannot be named

    old import { Injectable } from '@angular/core'; import { BehaviorSubject } from 'rxjs'; @Injectable( ...

  5. Rxjs 修改Observable 里的值

    有这么一个对象c$: Observable<any> 修改里边的值: 声明一个subject subject: Subject<any>; 在ngOnInit()中进行初始化 ...

  6. [RxJS] Hot Observable, by .share()

    .share() is an alias for .publish().refCount(). So if the source is not yet completed, no matter how ...

  7. RxJS——可观察的对象(Observable)

    可观察的(Observable) 可观察集合(Observables)是多值懒推送集合.它们填补了下面表格的空白: SINGLE MULTIPLE Pull Function Iterator Pus ...

  8. rxjs 入门--环境配置

    原文: https://codingthesmartway.com/getting-started-with-rxjs-part-1-setting-up-the-development-enviro ...

  9. RxJS + Redux + React = Amazing!(译二)

    今天,我将Youtube上的<RxJS + Redux + React = Amazing!>的后半部分翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: ht ...

随机推荐

  1. tstring

      是的,一旦知道 TCHAR 和_T 是如何工作的,那么这个问题很简单.基本思想是 TCHAR 要么是char,要么是 wchar_t,这取决于 _UNICODE 的值: // abridged f ...

  2. Ajax&XMLHttpRequest

    XMLHttpRequest 简单省力的方法 将文件编码成base64通过Ajax上传 HTML5学习之FileReader接口 HTML5学习之FileReader接口 通过Ajax方式上传文件,使 ...

  3. python模块基础之OS模块

    OS模块简单的来说它是一个Python的系统编程的操作模块,可以处理文件和目录这些我们日常手动需要做的操作. 可以查看OS模块的帮助文档: >>> import os #导入os模块 ...

  4. Set,Map数据结构

    /*Set : 多个value的集合, value不重复Map : 多个key-value对的集合, key不重复 1. Set容器 1). Set() 2). Set(array) 3). add( ...

  5. bootstrap table使用小记

    bootstrap table是一个非常不错的,基于bootstrap的插件,它扩展和丰富了bootstrap表格的操作,如格式化表格,表格选择器,表格工具栏,分页等等. 最近基于bootstrap开 ...

  6. (转)ASP.NET MVC 学习第一天

    天道酬勤0322   博客园 | 首页 | 发新随笔 | 发新文章 | 联系 | 订阅  | 管理 随笔:10 文章:0 评论:9 引用:0 ASP.NET MVC 学习第一天 今天开始第一天学习as ...

  7. SQL Server 如何创建定时作业

    在做SQL server 管理时,往往需要每日执行定时任务,但是如果每天都去人工执行,非常不方便,而且一般定时操作,都应该是在数据库压力不大时,一般是在夜间.所以我们需要创建定时作业来代替人工的执行定 ...

  8. php打印xml格式数据

    在你要输出的xml前边加       header("Content-type:text/xml;charset=utf-8"); 这个上边不要有任何输出 打印用echo 别用va ...

  9. destoon实现调用当前栏目分类及子分类和三级分类的方法

    调用当前栏目分类及子分类和三级分类是程序设计里常用的方法,本文就来详细讲述destoon实现调用当前栏目分类及子分类和三级分类的方法.具体操作如下: 在destoon中提供了如下的调用语句: 一级分类 ...

  10. 向asp.net项目中添加控件AspNetPager

    1.打开项目,把.dll文件放入项目中: 2.在工具栏中添加一个自定义选项卡