https://github.com/lxsmnsyc/liteobservable
Cold Observables for JS in a lightweight fashion
https://github.com/lxsmnsyc/liteobservable
observable observable-streams observer-pattern reactive reactive-programming reactivex
Last synced: about 1 month ago
JSON representation
Cold Observables for JS in a lightweight fashion
- Host: GitHub
- URL: https://github.com/lxsmnsyc/liteobservable
- Owner: lxsmnsyc
- License: mit
- Created: 2019-02-05T00:43:21.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2023-07-18T22:54:22.000Z (almost 2 years ago)
- Last Synced: 2025-04-13T02:19:35.414Z (about 1 month ago)
- Topics: observable, observable-streams, observer-pattern, reactive, reactive-programming, reactivex
- Language: TypeScript
- Size: 1.93 MB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# LiteObservable
Cold Observables for JS in just 617 bytes.
## Usage
### Installing
As a node module
```bash
npm i lite-observable
```
```yarn
yarn add lite-observable
```
### Creating an Observable
```js
const observable = Observable.create(emitter => {
emitter.next('Hello');
emitter.next('World');
emitter.complete();
});
```
Emitters have the following properties:
| Field | Type | Description |
| --- | --- | --- |
| next | ```function``` | Emits a value. |
| error | ```function``` | Emits an error signal. |
| complete | ```function``` | Emits a completion signal. |
| subscription | ```object``` | The subscription context. |
### Subscribing
```js
observable.subscribe(
x => console.log(`Next: ${x}`)
e => console.log(`Error: ${e}`),
() => console.log('Completed'),
);
```
Subscriptions have the following properties:
| Field | Type | Description |
| --- | --- | --- |
| active | ```function``` | Returns the current state of the subscription. Returns false if the subscription is disposed or finished. |
| dispose | ```function``` | Disposes the subscription. |
### Creating your own operators
With the ```pipe``` method, it is easy to create and use your own custom operators.
When constructing operators, it is recommended to use the constructor instead of ```create``` method to prevent subscription overhead, and to directly access the unabstracted Observer object. Use ```sub``` instead of ```subscribe``` to access the operator of the source Observable.
Example below is a map and filter operators:
```js
const map = mapper => source => new Observable((o) => {
const {
subscribe, complete, error, next,
} = o;
source.sub({
subscribe,
next: x => next(mapper(x)),
error,
complete,
});
});
const filter = predicate => source => new Observable((o) => {
const {
subscribe, complete, error, next,
} = o;
source.sub({
subscribe,
next: x => predicate(x) && next(x),
error,
complete,
});
});
```
Example usage:
```js
const observable = Observable.create((e) => {
for (let i = 0; i < 10; i += 1) {
e.next(i);
}
e.complete();
});
observable.pipe(
filter(x => x % 2 === 0),
map(x => x * 2),
map(x => `Next: ${x}`),
).subscribe(
console.log,
);
```
which outputs:
```
Next: 0
Next: 4
Next: 8
Next: 12
Next: 16
```