I RxJS er en observerbar funktion, der bruges til at skabe en observatør og knytte den til kilden, hvor værdier forventes fra. Eksempelvis er klik, musehændelser fra et DOM-element eller en Http-anmodning osv. eksempler på observerbare.
Med andre ord kan man sige, at observer er et objekt med tilbagekaldsfunktioner, som kaldes, når der er interaktion med det Observerbare. For eksempel har kilden interageret for et eksempel, knapklik, Http anmodning mv.
Observerbare kan også defineres som doven Push-samlinger med flere værdier. Lad os se et simpelt eksempel for at forstå, hvordan observerbare elementer bruges til at skubbe værdierne.
Se følgende eksempel:
import { Observable } from 'rxjs'; const observable = new Observable(subscriber => { subscriber.next(10); subscriber.next(20); subscriber.next(30); setTimeout(() => { subscriber.next(40); subscriber.complete(); }, 1000); }); I ovenstående eksempel er der en observerbar, der skubber værdierne 10, 20, 30 øjeblikkeligt og synkront, når den abonneres, men værdien 40 vil blive skubbet efter et sekund, siden abonnentmetoden har kaldt.
Hvis du vil påberåbe dig det observerbare og se ovenstående værdier, skal du abonnere på det. Se følgende eksempel:
import { Observable } from 'rxjs'; const observable = new Observable(subscriber => { subscriber.next(10); subscriber.next(20); subscriber.next(30); setTimeout(() => { subscriber.next(40); subscriber.complete(); }, 1000); }); console.log('These are the values just before subscribe'); observable.subscribe({ next(x) { console.log('We have got value ' + x); }, error(err) { console.error('something wrong occurred: ' + err); }, complete() { console.log('Done successfully'); } }); console.log('This value is just after subscribe'); Produktion:
Når vi udfører ovenstående program, får vi følgende resultat på konsollen:
Observerbare er generaliseringer af funktioner
Vi ved, at observerbare er funktioner, der fungerer som klik, musehændelser fra et DOM-element eller en Http-anmodning osv., men observerbare er ikke som EventEmitters, og de er heller ikke som løfter for flere værdier. I nogle tilfælde kan observerbare optræde som EventEmitters, nemlig når de multicastes ved hjælp af RxJS Subjects, men normalt opfører de sig ikke som EventEmitters.
Observerbare er som funktioner med nul argumenter, men generaliser dem for at tillade flere værdier.
Lad os se et eksempel for at forstå dette klart.
Et simpelt eksempel på en funktion:
function foo() { console.log('Hello World!'); return 123; } const x = foo.call(); // same as foo() console.log(x); const y = foo.call(); // same as foo() console.log(y); Produktion:
Du vil se følgende output:
char til heltal java
'Hello World!' 123 'Hello World!' 123
Lad os skrive det samme eksempel, men med Observables:
import { Observable } from 'rxjs'; const foo = new Observable(subscriber => { console.log('Hello World!'); subscriber.next(123); }); foo.subscribe(x => { console.log(x); }); foo.subscribe(y => { console.log(y); }); Produktion:
Du vil se det samme output som ovenfor:
Du kan se dette, fordi både funktioner og observerbare er dovne beregninger. Hvis du ikke kalder funktionen, vil console.log('Hello World!') ikke ske. Også med Observables, hvis du ikke 'ringer' til det med subscribe, vil console.log('Hello World!') ikke ske.
Arbejde med en observerbar
Der er tre faser i en observerbar:
- Oprettelse af observabler
- Abonner på Observables
- Udførelse af observabler
Oprettelse af observabler
Der er to måder at oprette observerbare på:
- Brug af Observable constructor-metoden
- Brug af Observable create() metode
Brug af Observable constructor-metoden
Lad os oprette en observerbar ved hjælp af den observerbare constructor-metode og tilføje en besked, 'This is my first Observable' ved hjælp af subscriber.next-metoden, der er tilgængelig i Observable.
testrx.js fil:
import { Observable } from 'rxjs'; var observable = new Observable( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); Du kan også oprette Observable ved at bruge Observable.create() metoden som følger:
import { Observable } from 'rxjs'; var observer = Observable.create( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); Abonner på Observables
At abonnere på en observerbar er som at kalde en funktion. Det giver tilbagekald, hvor dataene vil blive leveret til.
Du kan abonnere på en observerbar ved at bruge følgende syntaks:
sql vælg som
Syntaks:
observable.subscribe(x => console.log(x));
Se ovenstående eksempel med subscribe:
testrx.js fil:
import { Observable } from 'rxjs'; var observer = new Observable( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); observer.subscribe(x => console.log(x)); Produktion:
Udførelse af observabler
En observerbar udføres, når den tegnes. Der er generelt tre metoder i en observatør, der underrettes:
Næste(): Denne metode bruges til at sende værdier som et tal, streng, objekt osv.
komplet(): Denne metode sender ingen værdi. Det indikerer, at det observerbare er afsluttet.
fejl(): Denne metode bruges til at underrette fejlen, hvis nogen.
Lad os se et eksempel, hvor vi har oprettet det observerbare med alle tre meddelelser og udføre dette eksempel:
testrx.js fil:
import { Observable } from 'rxjs'; var observer = new Observable( function subscribe(subscriber) { try { subscriber.next('This is my first Observable'); subscriber.next('Testing Observable'); subscriber.complete(); } catch(e){ subscriber.error(e); } } ); observer.subscribe(x => console.log(x), (e)=>console.log(e), ()=>console.log('Observable is completed now.')); Fejlmetoden aktiveres kun, hvis der er en fejl. Når du kører ovenstående kode, vil du se følgende output i konsollen.
Produktion:
