rxjs操作符与ramda对比学习

rxjs vs ramda

2个R开头的库，都是函数式编程，对比学习可以达到知识相互巩固的目的!而且这两个库都很强大，都很常用!仅对比ArrayLike相关操作

rxjs(pipe)小技巧

pipe可以组合一些特定的操作，以便复用

// 功能从一个流中取第n个开始后m个数据
import { pipe, from } from 'rxjs';
import { skip, take } from 'rxjs/operators';
const takeNM = (n: number, m: number) => pipe(skip(n), take(m));
from([1, 2, 3, 4, 5, 6, 7, 8, 9]).pipe(
    takeNM(3, 6)
).subscribe(res => {
    // 4,5,6,7,8,9
    console.log(res)
});
复制代码

rxjs(zip,map) vs ramda(zip,zipObj,zipWith)

import { zip as rzip, zipWith, zipObj } from 'ramda';
import { from, zip } from 'rxjs';
import { map } from 'rxjs/operators';
const ages = [27, 25, 29, 30];
const names = ['Foo', 'Bar', 'Beer'];
const isDev = [true, true, false, false];
/**
 * [ [ 27, 'Foo' ], [ 25, 'Bar' ], [ 29, 'Beer' ] ]
 */
console.log(rzip(ages)(names));
/**
 * [ { '27': 'Foo' }, { '25': 'Bar' }, { '29': 'Beer' } ]
 */
console.log(zipWith(
    (x, y) => ({
        [`${x}`]: y
    })
)(ages, names));
/**
 * { Foo: 27, Bar: 25, Beer: 29 }
 */
console.log(zipObj(names)(ages));
zip(
    from(ages),
    from(names),
    from(isDev)
).pipe(
    map(([age, name, isDev]) => ({ age, name, isDev }))
).subscribe(res => {
    /**
     * { age: 27, name: 'Foo', isDev: true }
     * { age: 25, name: 'Bar', isDev: true }
     * { age: 29, name: 'Beer', isDev: false }
     */
    console.log(res)
})

// ramda 中的zip可以操作2个成对数组
// 同样功能可以用zip和map组合操作符实现
// rxjs更灵活
复制代码

rxjs(concatMap,map) vs ramda(xprod)

import { xprod } from 'ramda';
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];

/**
 [ [ 1, 4 ],
   [ 1, 5 ],
   [ 1, 6 ],
   [ 2, 4 ],
   [ 2, 5 ],
   [ 2, 6 ],
   [ 3, 4 ],
   [ 3, 5 ],
   [ 3, 6 ] ]
*/
console.log(xprod(arr1)(arr2));

import { from } from 'rxjs';
import { concatMap, map } from 'rxjs/operators';
// 时间维度
from(arr1).pipe(
    mergeMap((x) => from(arr2).pipe(
        map(item => [x, item])
    ))
).subscribe(res => console.log(res));
// 有序，依次，
from(arr1).pipe(
    concatMap((x) => from(arr2).pipe(
        map(item => [x, item])
    ))
).subscribe(res => {
    /**
     [ 1, 4 ]
    [ 1, 5 ]
    [ 1, 6 ]
    [ 2, 4 ]
    [ 2, 5 ]
    [ 2, 6 ]
    [ 3, 4 ]
    [ 3, 5 ]
    [ 3, 6 ]
    */
    console.log(res)
})
// mergeMap更合适，concatMap需等待complete
复制代码

rxjs() vs ramda(without)

import { without as rwithout } from 'ramda';

const list1 = [1, 2];
const list2 = [1, 2, 1, 3, 4];
// [ 3, 4 ]
console.log(rwithout(list1)(list2))

import { from } from 'rxjs';
import { without } from '../operators/without';
from(list2).pipe(
    without(
        from(list1)
    )
).subscribe(res => {
    /**
     * 3
     * 4
     */
    console.log(res)
})
rxjs没有类似功能操作符，需要实现一个，需求：
假设有两个流，从一个流中挑选出在第二流里没有出现过的值!
复制代码

without实现,总体也比较简单

import { OperatorFunction, Observable, Operator, Subscriber, ObservableInput, merge } from 'rxjs';
import { mergeAll } from 'rxjs/operators';
export function without<T, R>(...observables: ObservableInput<any>[]): OperatorFunction<T, R> {
    return (source: Observable<T>) => source.lift(new WithoutOperator(...observables));
}
class WithoutOperator<T, R> implements Operator<T, R> {
    private observables: ObservableInput<any>[]
    constructor(...observables: ObservableInput<any>[]) {
        this.observables = observables;
    }
    call(subscriber: Subscriber<R>, source: any): any {
        return source.subscribe(new WithoutSubscriber(subscriber, this.observables));
    }
}
class WithoutSubscriber<T, R> extends Subscriber<T> {
    private old: Set<any> = new Set();
    constructor(destination: Subscriber<R>, ...observables: ObservableInput<any>[]) {
        super(destination);
        merge(...observables).pipe(
            mergeAll()
        ).subscribe(res => {
            this.old.add(res);
        });
    }
    protected _next(x: T) {
        if (!this.old.has(x)) {
            this.destination.next(x);
        }
    }
}
复制代码

ramda(when) vs rxjs(zip,map)