Creating a Custom RxJS Operator


So you want to create a new RxJS operator? This article will demonstrate on how to create a custom operator, where its sole purpose is to simply represent the original observable.

In other words, the operator is merely the identity operator, or, to put it in simpler terms, does almost nothing at all.

E.g. observable.pipe(myCustomOperator()) is equivalent to just observable.

* Here is a custom operator. By convention, an operator is a function, that in-
* turn, returns a function, and that function returns an observable.
function myCustomOperator<T>(/* Some parameters, here, if need be */) {
// This is the function that will return the obsevable.
return (source: Observable<T>) => {
return new Observable((subscriber) => {
// Of course, you can't do much without actually having subscribed to the
// source, or a synthesis, thereof.
// Here, we're just going to subscribe to the source.
source.subscribe((value) => {
// Pass along the value, without doing much at all.
// Note: we could have just invoked `source.subscribe(subscriber)`, but we
// need to write a demo such that you can modify this code, for the
// purposes of creating a custom operator.
Edit this page
Want to make your own site like this? Try gatsby-theme-code-notes by Zander Martineau.
Notes on code. My second brain, by Sal Rahman.