Rxjs-Tutorial

转化为observable

    // From one or multiple values
    Rx.Observable.of('foo', 'bar');

    // From array of values
    Rx.Observable.from([1,2,3]);

    // From an event
    Rx.Observable.fromEvent(document.querySelector('button'), 'click');

    // From a Promise
    Rx.Observable.fromPromise(fetch('/users'));

    // From a callback (last argument is a callback)
    // fs.exists = (path, cb(exists))
    var exists = Rx.Observable.bindCallback(fs.exists);
    exists('file.txt').subscribe(exists => console.log('Does file exist?', exists));

    // From a callback (last argument is a callback)
    // fs.exists = (pathA, pathB, cb(err, result))
    var rename = Rx.Observable.bindNodeCallback(fs.rename);
    rename('file.txt', 'else.txt').subscribe(() => console.log('Renamed!'));

创建observable

//外部产生事件
    var myObservable = Rx.Subject.create();
    myObservable.subscribe(value => console.log(value));
    myObservable.next('foo');
//内部产生事件
    var myObservable = Rx.Observable.create(observer => {
      observer.next('foo');
      setTimeout(() => observer.next('bar'), 1000);
    });
    myObservable.subscribe(value => console.log(value));

事件流的控制

    // typing "hello world"
    var input = Rx.Observable.fromEvent(document.querySelector('input'), 'keypress');

    // Filter out target values less than 3 characters long
    input.filter(event => event.target.value.length > 2)
      .subscribe(value => console.log(value)); // "hel"

    // Delay the events
    input.delay(200)
      .subscribe(value => console.log(value)); // "h" -200ms-> "e" -200ms-> "l" ...

    // Only let through an event every 200 ms
    input.throttleTime(200)
      .subscribe(value => console.log(value)); // "h" -200ms-> "w"

    // Let through latest event after 200 ms
    //200ms后没有发生新的事件则不触发
    input.debounceTime(200)
      .subscribe(value => console.log(value)); // "o" -200ms-> "d"

    // Stop the stream of events after 3 events
    input.take(3)
      .subscribe(value => console.log(value)); // "hel"

    // Passes through events until other observable triggers an event
    var stopStream = Rx.Observable.fromEvent(document.querySelector('button'), 'click');
    input.takeUntil(stopStream)
      .subscribe(value => console.log(value)); // "hello" (click)
posted @ 2016-10-18 15:15  FengeLiu  阅读(167)  评论(0)    收藏  举报