[RxJS] Creating Observable From Scratch
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的更多相关文章
- Angular学习笔记—RxJS与Observable(转载)
1. Observable与观察者模式的关系 其实这里讲的Observable就是一种观察者模式,只不过RxJS把Observable结合了迭代模式以及附件了很多的operator,让他变得很强大,也 ...
- [rxjs] Creating An Observable with RxJS
Create an observable var Observable = Rx.Observable; var source = Observable.create(function(observe ...
- [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 ...
- 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( ...
- Rxjs 修改Observable 里的值
有这么一个对象c$: Observable<any> 修改里边的值: 声明一个subject subject: Subject<any>; 在ngOnInit()中进行初始化 ...
- [RxJS] Hot Observable, by .share()
.share() is an alias for .publish().refCount(). So if the source is not yet completed, no matter how ...
- RxJS——可观察的对象(Observable)
可观察的(Observable) 可观察集合(Observables)是多值懒推送集合.它们填补了下面表格的空白: SINGLE MULTIPLE Pull Function Iterator Pus ...
- rxjs 入门--环境配置
原文: https://codingthesmartway.com/getting-started-with-rxjs-part-1-setting-up-the-development-enviro ...
- RxJS + Redux + React = Amazing!(译二)
今天,我将Youtube上的<RxJS + Redux + React = Amazing!>的后半部分翻译(+机译)了下来,以供国内的同学学习,英文听力好的同学可以直接看原版视频: ht ...
随机推荐
- Android SDK Manager 无法更新SDK
Android SDK Manager 被墙后无法更新SDK 下载sdk时抛出错误:Failed to fetch URL http://dl-ssl.google.com/ 參考例如以下博客: ht ...
- SplitButton( 分割按钮)
一. 加载方式//class 加载方式<a href="javascript:void(0)" id="edit" class="easyui- ...
- SQLServer2008/2012 删除所有表视图存储过程
SQLServer2008/2012 删除所有表视图存储过程 -------------------删除所有的表-------------------use xuwenbin111--/第1步**** ...
- Swift--基础(二)元组 断言 错误处理
元组(tuples) 把多个值组合成一个复合值.元组内的值可以是任意类型,并不要求是相同类型 let http404Error = (404, "Not Found") let ( ...
- Ajax--WebService返回List
WebService: using System.Web.Script.Services; [GenerateScriptType(typeof(people))] [WebMethod] publi ...
- params参数的使用方法
params 将方法中实际参数列表中跟可变参数数组类型一致的类型,都处理为数组中的的元素 static void Main(string[] arr) { // int[] numbers={2,3, ...
- myeclipseb笔记(4):拷贝文件的相应配置
在MyEclipse中,经常需要用到拷贝工程文件,但是直接拷贝的话,就会出现访问不了的情况,如下: 原文件learn/StudManage/login.jsp,访问: 拷贝工程,改名,访问: 就出现了 ...
- 转载:JSONObject简介
转载网址:http://www.cnblogs.com/java-pan/archive/2012/04/07/JSONObject.html JSONObject简介 本节摘要:之前对JSON做 ...
- MySQL 忘记密码后的重置操作
一.修改配置文件方式 1.关闭 MySQL linux: 1)service mysqld stop ...
- jQuery对下拉框、单选框、多选框的处理
下拉框: //得到下拉菜单的选中项的文本(注意中间有空格) var cc1 = $(".formc select[@name='country'] option[@selected]&quo ...