I RxJS är en observerbar funktion som används för att skapa en observatör och koppla den till källan där värden förväntas ifrån. Till exempel är klick, mushändelser från ett DOM-element eller en HTTP-förfrågan, etc. exempel på observerbara.
Med andra ord kan man säga att observer är ett objekt med callback-funktioner, som anropas när det finns interaktion med den observerbara. Till exempel, källan har interagerat för ett exempel, knappklick, Http begäran osv.
Observerbara objekt kan också definieras som lata Push-samlingar med flera värden. Låt oss se ett enkelt exempel för att förstå hur observerbara objekt används för att driva värdena.
Se följande exempel:
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 exemplet ovan finns det en observerbar som trycker på värdena 10, 20, 30 omedelbart och synkront vid prenumeration, men värdet 40 kommer att tryckas efter en sekund sedan prenumerationsmetoden har anropat.
Om du vill åberopa det observerbara och se ovanstående värden måste du prenumerera på det. Se följande exempel:
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 kör programmet ovan får vi följande resultat på konsolen:
Observerbara är generaliseringar av funktioner
Vi vet att observerbara är funktioner som fungerar som klick, mushändelser från ett DOM-element eller en Http-förfrågan, etc. men observerbara är inte som EventEmitters, och de är inte heller som Promises för flera värden. I vissa fall kan observerbara objekt agera som EventEmitters, nämligen när de multicastas med RxJS Subjects, men vanligtvis agerar de inte som EventEmitters.
Observerbara är som funktioner med noll argument, men generalisera dem för att tillåta flera värden.
Låt oss se ett exempel för att förstå detta tydligt.
Ett enkelt exempel 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 kommer att se följande utdata:
'Hello World!' 123 'Hello World!' 123
Låt oss skriva samma exempel, 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 kommer att se samma utdata som ovan:
Du kan se detta eftersom både funktioner och observerbara är lata beräkningar. Om du inte anropar funktionen kommer console.log('Hello World!') inte att hända. Dessutom, med Observables, om du inte 'ringar' det med prenumeration, kommer inte console.log('Hello World!') att hända.
Arbete av en observerbar
Det finns tre faser i en observerbar:
- Skapa observerbara objekt
- Prenumerera på Observables
- Exekvera observerbara objekt
Skapa observerbara objekt
Det finns två sätt att skapa observerbara objekt:
- Använder metoden Observable constructor
- Använder observable create()-metoden
Använder metoden Observable constructor
Låt oss skapa en observerbar med den observerbara konstruktormetoden och lägga till ett meddelande 'This is my first Observable' med hjälp av subscriber.next-metoden som är tillgänglig 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 också skapa Observable med metoden Observable.create() enligt följande:
import { Observable } from 'rxjs'; var observer = Observable.create( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); Prenumerera på Observables
Att prenumerera på en observerbar är som att anropa en funktion. Det ger återuppringningar dit data kommer att levereras till.
Du kan prenumerera på en observerbar genom att använda följande syntax:
Syntax:
observable.subscribe(x => console.log(x));
Se exemplet ovan med prenumerera:
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:
Exekvera observerbara objekt
En observerbar exekveras när den tecknas. Det finns i allmänhet tre metoder i en observatör som meddelas:
Nästa(): Denna metod används för att skicka värden som ett tal, sträng, objekt etc.
komplett(): Den här metoden skickar inget värde. Det indikerar att det observerbara är slutfört.
fel(): Denna metod används för att meddela felet om något.
Låt oss se ett exempel där vi har skapat det observerbara med alla tre meddelanden och kör det exemplet:
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.')); Felmetoden anropas endast om det finns ett fel. När du kör ovanstående kod kommer du att se följande utdata i konsolen.
Produktion:
java volatile nyckelord
