[RxJS] Creation operators: from, fromArray, fromPromise

The of() operator essentially converted a list of arguments to an Observable. Since arrays are often how we structure list of things in JavaScript, we should have a way of transforming arrays into Observables. This lesson teaches how you can convert from Arrays to Observables, from Promises to Observables, and from Iterators to Observables.

formArray:

var ary = [1,2,3];
var foo = Rx.Observable.fromArray(ary);

foo.subscribe(function (x) {
  console.log(‘next ‘ + x);
}, function (err) {
  console.log(‘error ‘ + err);
}, function () {
  console.log(‘done‘);
});

/*
"next 1"
"next 2"
"next 3"
"done"
*/

fromPromise:

var prom = fetch(‘https://null.jsbin.com‘);
var foo = Rx.Observable.fromPromise(prom);

foo.subscribe(function (x) {
  console.log(‘next ‘ + x.status);
}, function (err) {
  console.log(‘error ‘ + err);
}, function () {
  console.log(‘done‘);
});

/*
"next 204"
"done"
*/

from:

from() opreator can create observalbes according to what you passed in

=fromArray:

var ary = [1,2,3];
var foo = Rx.Observable.from(ary);

foo.subscribe(function (x) {
  console.log(‘next ‘ + x);
}, function (err) {
  console.log(‘error ‘ + err);
}, function () {
  console.log(‘done‘);
});

/*
"next 1"
"next 2"
"next 3"
"done"
*/

=fromPromiose

var foo = Rx.Observable.from(prom);

foo.subscribe(function (x) {
  console.log(‘next ‘ + x.status);
}, function (err) {
  console.log(‘error ‘ + err);
}, function () {
  console.log(‘done‘);
});

From iterator:

function* generator(){
  yield 10;
  yield 20;
  yield 30;
}

var iterator = generator();
var foo = Rx.Observable.from(iterator);

foo.subscribe(function (x) {
  console.log(‘next ‘ + x);
}, function (err) {
  console.log(‘error ‘ + err);
}, function () {
  console.log(‘done‘);
});

/*
"next 10"
"next 20"
"next 30"
"done"
*/
时间: 2024-10-24 20:50:18

[RxJS] Creation operators: from, fromArray, fromPromise的相关文章

[RxJS] Creation operators: empty, never, throw

This lesson introduces operators empty(), never(), and throw(), which despite being plain and void of functionality, are very useful when combining with other Observables. empty: var foo = Rx.Observable.empty(); // the same as var foo = Rx.Observable

[RxJS] Creation operators: interval and timer

It is quite common to need an Observable that ticks periodically, for instance every second or every 100 miliseconds. We will learn about operators interval() and timer(), both of which are similar to setInterval() in JavaScript. Interval(period): Yo

[RxJS] Creation operators: fromEventPattern, fromEvent

Besides converting arrays and promises to Observables, we can also convert other structures to Observables. This lesson teaches how we can convert any addEventHandler/removeEventHandler API to Observables. fromEvent(target, EventType): var foo = Rx.O

[RxJS] Creation operator: of()

RxJS is a lot about the so-called "operators". We will learn most of the important operators, one by one. In this lesson, we will see our first creation operator: of(). var foo = Rx.Observable.of(42, 100, 200); // var bar = Rx.Observable.create(

[RxJS] Creation operator: create()

We have been using Observable.create() a lot in previous lessons, so let's take a closer look how does it work. The create function: var foo = Rx.Observable.create( function(observer){ observer.next(42); observer.next(100); observer.next(200); observ

[RxJS] Transformation operators: delay and delayWhen

This lessons teaches about delay and delayWhen: simple operators that time shift. delay(number | date) var foo = Rx.Observable.interval(500).take(5); /* --0--1--2--3--4| delay(1000) -----0--1--2--3--4| */ // delay(1000) var result = foo.delay(1000);

[RxJS] Filtering operators: throttle and throttleTime

Debounce is known to be a rate-limiting operator, but it's not the only one. This lessons introduces you to throttleTime and throttle, which only drop events (without delaying them) to accomplish rate limiting. throttleTime(number): first emits, then

[RxJS] Filtering operators: distinct and distinctUntilChanged

Operator distinct() and its variants are an important type of Filtering operator. This lessons shows how they work and in what cases are they useful. distinctUntilChanged(): var foo = Rx.Observable.interval(500).take(5) .zip(Rx.Observable.of('a','b',

[RxJS] Combination operators: concat, startWith

Some Observables may complete, and we may want to append another Observable to the one which just completed. This lesson teaches you how to use the concat() operator for either appending or prepending, and how the shortcut operator startWith() is an