Rxjs(三)

作者: 蒋小花_4b6c | 来源:发表于2020-04-29 13:38 被阅读0次

1.do

const source = Rx.Observable.of([1,2,3,4,5]);

const example = source

    .do( val => console.log(`beforeMap:${val}`))

    .map( val => val + 10)

    .do( val => console.log(`afterMap${val}`));

const subscrbe = {  }; // 11 12 13 14 15

2.toPromise

将observable转换成promise

const sample = val => Rx.Observable.of(val).delay(5000);

const example = sample('firstExample').toPromise().then(result => console.log(result))

3. reduce

将源observable的值归并为单个值,

当源observable完成时将这个值发出

累加

const source = Rx.Observable.of(1,2,3,4);

const example = source.reduce(

    (acc, val) => acc + val

);

const subscribe = { }; // 10

4. scan

随着时间的推移进行归并

const subject = new Rx.Subject();

const example = subject.startWith(0).scan(

    (acc, curr) => acc + curr

);

const subscrbe = {  };

subject.next(1); // 1

subject.next(2); // 3

subject.next(3); // 6

5. expand

递归调用提供的函数

const source = Rx.Observable.of(2);

const example = source.expand(

    val => {

        console.log(`value: ${val}`);

        // 2 3 4 5 6

        return Rx.Observable.of(1 + val);

    }

).take(5);

const subscribe = {  }; // 2 3 4 5 6

5. groupBy

const people = [

    { name: 'Sue', age: 22},

    { name: 'Joe', age: 23},

    { name: 'Frank', age: 22},

    { name: 'Surah', age: 25}

];

const source = Rx.Observable.from(prople);

const example = source.groupBy(

    person => person.age

).mergeMap(

    group => group.toArray()

);

const subscribe = {  };

// [ { name: 'Sue', age: 22},{ name: 'Frank', age: 22}]

// [{ name: 'Joe', age: 23}]

// [{ name: 'Surah', age: 25}]

6.pluck

根据属性来发出

const source = Rx.Observale.from([

    { name: 'Joe', age: 20},

    { name: 'Bob', age: 25},

]);

const example = source.pluck('name');

const subscribe = {  }; // Joe  Bob

const source = Rx.observable.from([

    {

        name: 'Joe',

        age: 22,

        obj: {

            title: 'Developer',

            language: 'Javascript'

        }

    },

    {

        name: 'Sarah',

        age: 25

    }

]);

const example = Rx.Observable.pluck('job', 'title');

const subscribe = {  }; // Developer undefined

7.partition

 分隔

// 分隔偶数奇数

const source = Rx.Observable.from([1,2,3,4,5,6]);

const [events, odds] = source.partition(val => val % 2 === 0);

const subscribe = Rx.Observable.merge(

    events.map(val => `Event: ${val}`),

    odds.map(val => `Odd: ${val}`)

).subscribe(

    val => console.log(val)

);

9. throttle

仅当由提供的函数所确定的持续时间已经过去时才发出值

const source = Rx.Observable.interval(1000);

const example = source.throttle(val => Rx.Observable.interval(2000));

const subscrbe = {  }; // 0  3  6  9

10.throttleTime

当指定的持续时间经过后发出最新值

const source = Rx.Observable.interval(1000);

const example = source.throttleTimeo(5000);

const  subscribe = {  }; // 0  6  12

相关文章

网友评论

      本文标题:Rxjs(三)

      本文链接:https://www.haomeiwen.com/subject/jsacmhtx.html