W RxJS obserwowalność to funkcja używana do utworzenia obserwatora i dołączenia go do źródła, od którego oczekiwane są wartości. Na przykład kliknięcia, zdarzenia myszy z elementu DOM lub żądanie HTTP itp. są przykładami obserwowalnymi.
Innymi słowy, można powiedzieć, że obserwator to obiekt posiadający funkcje wywołania zwrotnego, który jest wywoływany, gdy następuje interakcja z Obserwowalnym. Na przykład źródło weszło w interakcję, na przykład kliknięcie przycisku, Http prośba itp.
Obserwowalne można również zdefiniować jako leniwe zbiory Push zawierające wiele wartości. Zobaczmy prosty przykład, aby zrozumieć, w jaki sposób obserwable są wykorzystywane do przesuwania wartości.
ipconfig na Ubuntu
Zobacz następujący przykład:
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); }); W powyższym przykładzie istnieje obserwowalność, która po subskrybowaniu przekazuje wartości 10, 20, 30 natychmiast i synchronicznie, ale wartość 40 zostanie wypchnięta po jednej sekundzie od wywołania metody subskrypcji.
Jeśli chcesz wywołać obserwowalne i zobaczyć powyższe wartości, musisz to zasubskrybować. Zobacz następujący przykład:
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'); Wyjście:
Kiedy wykonamy powyższy program, na konsoli otrzymamy następujący wynik:
Obserwable są uogólnieniami funkcji
Wiemy, że obserwable to funkcje, które działają jak kliknięcia, zdarzenia myszy z elementu DOM lub żądanie Http itp., ale obserwable nie przypominają EventEmitterów ani nie są obietnicami dla wielu wartości. W niektórych przypadkach obserwable mogą działać jak emitery zdarzeń, a mianowicie, gdy są przesyłane multiemisji przy użyciu podmiotów RxJS, ale zazwyczaj nie zachowują się jak emitery zdarzeń.
lista inicjalizacyjna Pythona
Obserwable są jak funkcje z zerowymi argumentami, ale uogólniają je, aby umożliwić wiele wartości.
Zobaczmy przykład, aby to jasno zrozumieć.
Prosty przykład funkcji:
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); Wyjście:
Zobaczysz następujące dane wyjściowe:
'Hello World!' 123 'Hello World!' 123
Napiszmy ten sam przykład, ale z obserwowalnymi:
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); }); Wyjście:
Zobaczysz takie same dane wyjściowe jak powyżej:
Można to zobaczyć, ponieważ zarówno funkcje, jak i obiekty obserwowalne są leniwymi obliczeniami. Jeśli nie wywołasz tej funkcji, console.log('Hello World!') nie zostanie wykonane. Ponadto w przypadku Observables, jeśli nie „wywołasz” tego za pomocą subskrypcji, console.log('Hello World!') nie nastąpi.
Działanie obserwowalnego
Istnieją trzy fazy obserwowalności:
Diana Ankudinowa
- Tworzenie obserwowalnych
- Subskrybowanie Observables
- Wykonywanie obserwacji
Tworzenie obserwowalnych
Istnieją dwa sposoby tworzenia obserwowalnych:
- Korzystanie z metody konstruktora Observable
- Korzystanie z metody Observable create().
Korzystanie z metody konstruktora Observable
Stwórzmy obserwowalny obiekt za pomocą metody konstruktora obserwowalnego i dodajmy wiadomość „To jest mój pierwszy Obserwowalny” za pomocą metody subskrybent.next dostępnej w Obserwowalnym.
plik testrx.js:
import { Observable } from 'rxjs'; var observable = new Observable( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); Możesz także utworzyć Observable za pomocą metody Observable.create() w następujący sposób:
import { Observable } from 'rxjs'; var observer = Observable.create( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); Subskrybowanie Observables
Subskrybowanie obserwowalnego jest jak wywołanie funkcji. Zapewnia wywołania zwrotne, do których dane zostaną dostarczone.
Możesz subskrybować obserwowalny, używając następującej składni:
Składnia:
drzewo binarne w Javie
observable.subscribe(x => console.log(x));
Zobacz powyższy przykład z subskrypcją:
plik 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)); Wyjście:
Wykonywanie obserwacji
Obserwowalny jest wykonywany, gdy jest subskrybowany. Zasadniczo istnieją trzy metody powiadamiania obserwatora:
Następny(): Ta metoda służy do wysyłania wartości, takich jak liczba, ciąg znaków, obiekt itp.
kompletny(): Ta metoda nie wysyła żadnej wartości. Wskazuje, że obserwowalne jest zakończone.
błąd(): Ta metoda służy do powiadamiania o błędzie, jeśli wystąpi.
Zobaczmy przykład, w którym utworzyliśmy obserwowalny ze wszystkimi trzema powiadomieniami i wykonajmy ten przykład:
kwartały w roku
plik 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.')); Metoda error jest wywoływana tylko w przypadku wystąpienia błędu. Po uruchomieniu powyższego kodu w konsoli zobaczysz następujące dane wyjściowe.
Wyjście:
