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. sqlserver,执行生成脚本时“引发类型为“System.OutOfMemoryException”的异常”(已解决)

    sqlserver,执行生成脚本时“引发类型为“System.OutOfMemoryException”的异常”(已解决) 出现此错误主要是因为.sql的脚本文件过大(一般都超过100M)造成内存无法 ...

  2. easyui-form添加自定义表单验证

    easyui自定义表单验证规则其实不是很复杂,只要重写一下重写 $.fn.validatebox.defaults.rules 自定义示例 $.extend($.fn.validatebox.defa ...

  3. NHIBERNATE之映射文件配置说明(转载4)

    二十.自定义值类型   开发者创建属于他们自己的值类型也是很容易的.比如说,你可能希望持久化Int64类型的属性, 持久化成为VARCHAR 字段.NHibernate没有内置这样一种类型.自定义类型 ...

  4. 贴近浏览器窗口右侧的jqueryui dialog快速从左侧调整大小时对话框大小设置不准确的问题

    之前在做两个相同的页面的事件同步时发现了这个问题,现在把它记录下来. 一.问题描述 页面中的jqueryui对话框,如果把它拖动到靠近浏览器窗口右侧边缘,并快速从对话框左侧调整对话框窗口大小时,对话框 ...

  5. Edusoho 的 Arale validator使用说明

    1.js控制器文件开端 var Validator = require('bootstrap.validator'); require('common/validator-rules').inject ...

  6. jsonp跨域请求学习笔记

    前言 ajax,用苍白的话赞扬:很好. 我们可以使用ajax实现异步获取数据,减少服务器运算时间,大大地改善用户体验:我们可以使用ajax实现小系统组合大系统:我们还可以使用ajax实现前端的优化.( ...

  7. 引入css外部样式表

    前言 为什么会有这篇文章,外部引入样式有什么好谈的,不外乎就是 <link rel="stylesheet" href="style.css" /> ...

  8. 文成小盆友python-num3 集合,函数,-- 部分内置函数

    本接主要内容: set -- 集合数据类型 函数 自定义函数 部分内置函数 一.set 集合数据类型 set集合,是一个无序且不重复的元素集合 集合基本特性 无序 不重复 创建集合 #!/bin/en ...

  9. [SQL注入2]FROM SQL INJECTION TO SHELL: POSTGRESQL EDITION

    FROM SQL INJECTION TO SHELL: POSTGRESQL EDITION 这里先介绍一下POSTGRESQL.这是一款数据库管理系统,与oracle是同类型软件.08年左右的市场 ...

  10. 关于栈和堆的定量分析(★firecat推荐★)

    文章来源:http://blog.csdn.net/bigbug_zju/article/details/39525281 计算机系统中的堆和栈是跟程序员最密切的两个概念.如果没有栈和堆的概念,下面程 ...