【Rxjs活用講座】deferで作るステイトフルでPipeableなカスタムオペレーターの作り方

            import { Observable } from 'rxjs';

const something$: Observable<any> = ... // Implement an observable

something$.pipe(
    myAwesomePipe() // Custom Pipeable
).subscribe(res => console.log(res))

        

            + 純粋関数:
    数学的な関数

+ 不純な関数:
    数学的でない関数

+ 参照透過性:
    関数の唯一性

+ 副作用:
    出力の外部依存性、
    もしくは関数外部への出力、
    もしくはグローバル変数の操作

        

            + 外部からの入力:
    グローバル変数やdocument.getElementByIdなどの関数の
    引数以外の入力に出力が依存している

+ 外部への出力:
    console.logなどで関数外部への出力している

+ 外部の操作:
    グローバル変数に対する代入などを操作している

        

            + コード可読性の向上
+ ログやデバック機能の実装
+ エラーハンドリング

        

            const customOperator = () => (source: Observable<any>) => new Observable<any>()

        

            import { map } from 'rxjs';

const myPow = (n: number) => map(x => Math.pow(x, n));

        

            const statefulPipe = () => (source: Observable<any>) => defer(() => source.pipe(
    map( /* ...do something with state */ ),
    tap( /* ...do something with state */ ),
    switchMap( /* ...do something with state */ ),
    filter( /* ...do something with state */ ),
    // ...
));

        

            of(1).pipe(
    stateful()
).subscribe(
    res => console.log(res)
);