V RxJS je pozorovatelná funkce, která se používá k vytvoření pozorovatele a jeho připojení ke zdroji, odkud se očekávají hodnoty. Například kliknutí, události myši z prvku DOM nebo požadavek Http atd. jsou příkladem pozorovatelných.
Jinými slovy, můžete říci, že pozorovatel je objekt s funkcemi zpětného volání, který je volán, když dojde k interakci s Observable. Zdroj například interagoval, kliknutí na tlačítko, HTTP žádost atd.
Observables lze také definovat jako líné Push kolekce více hodnot. Podívejme se na jednoduchý příklad, abychom pochopili, jak se pozorovatelné používají k posunu hodnot.
Viz následující příklad:
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); }); Ve výše uvedeném příkladu je pozorovatelný prvek, který při přihlášení k odběru okamžitě a synchronně vloží hodnoty 10, 20, 30, ale hodnota 40 bude vložena po jedné sekundě od volání metody odběru.
Pokud chcete vyvolat pozorovatelné a vidět výše uvedené hodnoty, musíte se přihlásit k odběru. Viz následující příklad:
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'); Výstup:
Když spustíme výše uvedený program, dostaneme na konzoli následující výsledek:
Pozorovatelné jsou zobecnění funkcí
Víme, že pozorovatelné jsou funkce, které fungují jako kliknutí, události myši z prvku DOM nebo požadavek Http atd., ale pozorovatelné nejsou jako EventEmitters, ani jako Promises pro více hodnot. V některých případech se pozorovatelné mohou chovat jako EventEmitters, konkrétně když jsou multicastovány pomocí RxJS Subjects, ale obvykle se jako EventEmittery nechovají.
Observables jsou jako funkce s nulovými argumenty, ale zobecňují je, aby umožňovaly více hodnot.
Podívejme se na příklad, abychom to jasně pochopili.
Jednoduchý příklad funkce:
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); Výstup:
Uvidíte následující výstup:
java tutoriály
'Hello World!' 123 'Hello World!' 123
Napišme stejný příklad, ale s 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); }); Výstup:
Uvidíte stejný výstup jako výše:
Můžete to vidět, protože funkce i Observables jsou líné výpočty. Pokud funkci nezavoláte, konzola.log('Hello World!') se nestane. Také u Observables, pokud to „nevoláte“ pomocí předplatného, konzola.log('Hello World!') se nestane.
Fungování pozorovatele
V pozorovateli jsou tři fáze:
- Vytváření Observables
- Přihlášení k odběru Observables
- Provádění Observables
Vytváření Observables
Existují dva způsoby, jak vytvořit pozorovatelné:
- Použití metody pozorovatelného konstruktoru
- Použití metody Observable create().
Použití metody pozorovatelného konstruktoru
Vytvořme pozorovatelnou pomocí metody pozorovatelného konstruktoru a přidejte zprávu 'Toto je moje první pozorovatelná' pomocí metody subscriber.next dostupné v rámci Observable.
soubor testrx.js:
import { Observable } from 'rxjs'; var observable = new Observable( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); Observable můžete také vytvořit pomocí metody Observable.create() takto:
import { Observable } from 'rxjs'; var observer = Observable.create( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); Přihlášení k odběru Observables
Přihlášení k pozorovatelnému je jako volání funkce. Poskytuje zpětná volání, kam budou data doručena.
Můžete se přihlásit k odběru pozorovatelného pomocí následující syntaxe:
Syntax:
observable.subscribe(x => console.log(x));
Viz výše uvedený příklad s odběrem:
soubor testrx.js:
import { Observable } from 'rxjs'; var observer = new Observable( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); observer.subscribe(x => console.log(x)); Výstup:
Provádění Observables
Pozorovatelný je proveden, když je upsán. Obecně existují tři metody v pozorovateli, které jsou oznámeny:
další(): Tato metoda se používá k odesílání hodnot, jako je číslo, řetězec, objekt atd.
kompletní(): Tato metoda neposílá žádnou hodnotu. Označuje, že pozorovatelná je dokončena.
chyba(): Tato metoda se používá k upozornění na případnou chybu.
Podívejme se na příklad, kde jsme vytvořili pozorovatelný prvek se všemi třemi oznámeními a provedli tento příklad:
soubor testrx.js:
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.')); Chybová metoda je vyvolána pouze v případě, že dojde k chybě. Když spustíte výše uvedený kód, uvidíte v konzole následující výstup.
Výstup:
