【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)
);