logo

RxJS novērojamie

RxJS novērojamā funkcija ir funkcija, ko izmanto, lai izveidotu novērotāju un pievienotu to avotam, no kura tiek gaidītas vērtības. Piemēram, novērojamie ir klikšķi, peles notikumi no DOM elementa vai HTTP pieprasījuma utt.

Citiem vārdiem sakot, jūs varat teikt, ka novērotājs ir objekts ar atzvanīšanas funkcijām, kas tiek izsaukts, kad notiek mijiedarbība ar novērojamo. Piemēram, avots ir mijiedarbojies, piemēram, pogas klikšķis, Http pieprasījums utt.

window.open javascript

Novērojamos objektus var definēt arī kā vairāku vērtību slinkas Push kolekcijas. Apskatīsim vienkāršu piemēru, lai saprastu, kā novērojamie dati tiek izmantoti vērtību virzīšanai.

Skatiet šādu piemēru:

 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); }); 

Iepriekš minētajā piemērā ir novērojams, kas abonēšanas laikā nekavējoties un sinhroni nospiež vērtības 10, 20, 30, bet vērtība 40 tiks nospiesta pēc vienas sekundes kopš abonēšanas metodes izsaukšanas.

Ja vēlaties izsaukt novērojamo un redzēt iepriekš minētās vērtības, jums tas ir jāabonē. Skatiet šādu piemēru:

 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'); 

Izvade:

Kad mēs izpildām iepriekš minēto programmu, mēs konsolē iegūsim šādu rezultātu:

RxJS novērojamie

Novērojamie ir funkciju vispārinājumi

Mēs zinām, ka novērojamie elementi ir funkcijas, kas darbojas kā klikšķi, peles notikumi no DOM elementa vai HTTP pieprasījuma utt., taču novērojamie objekti nav tādi kā EventEmitters, ne arī kā solījumi vairākām vērtībām. Dažos gadījumos novērojamie objekti var darboties kā EventEmitters, proti, ja tie tiek pārraidīti multiraides režīmā, izmantojot RxJS Subjects, taču parasti tie nedarbojas kā EventEmitters.

Novērojamie ir kā funkcijas ar nulli argumentiem, taču tās vispārina, lai atļautu vairākas vērtības.

Apskatīsim piemēru, lai to skaidri saprastu.

Vienkāršs funkcijas piemērs:

 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); 

Izvade:

Jūs redzēsit šādu izvadi:

 'Hello World!' 123 'Hello World!' 123 

Rakstīsim to pašu piemēru, bet ar 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); }); 

Izvade:

Jūs redzēsit tādu pašu izvadi kā iepriekš:

RxJS novērojamie

To var redzēt, jo gan funkcijas, gan novērojamie ir slinki aprēķini. Ja neizsauksit funkciju, fails console.log('Sveika pasaule!') nenotiks. Turklāt, izmantojot Observables, ja jūs to neizsaucat, izmantojot abonēšanu, console.log ('Sveika pasaule!') nenotiks.

Novērojamā darbība

Novērojamajā attēlā ir trīs fāzes:

  • Novērojamo objektu izveide
  • Observables abonēšana
  • Novērojamo objektu izpilde

Novērojamo objektu izveide

Ir divi veidi, kā izveidot novērojumus:

  • Izmantojot Observable konstruktora metodi
  • Izmantojot Observable create() metodi

Izmantojot Observable konstruktora metodi

Izveidosim novērojamo objektu, izmantojot observable konstruktora metodi, un pievienosim ziņojumu “Šis ir mans pirmais novērojums”, izmantojot Observable sadaļā pieejamo metodi subscriber.next.

java pārvērst virkni par veselu skaitli

fails testrx.js:

 import { Observable } from 'rxjs'; var observable = new Observable( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); 

Varat arī izveidot Observable, izmantojot metodi Observable.create() šādi:

 import { Observable } from 'rxjs'; var observer = Observable.create( function subscribe(subscriber) { subscriber.next('This is my first Observable') } ); 

Observables abonēšana

Novērojamā objekta abonēšana ir kā funkcijas izsaukšana. Tas nodrošina atzvanīšanu, kur dati tiks piegādāti.

Varat abonēt novērojamo, izmantojot šādu sintaksi:

Sintakse:

 observable.subscribe(x => console.log(x)); 

Skatiet iepriekš redzamo piemēru ar abonēšanu:

fails 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)); 

Izvade:

RxJS novērojamie

Novērojamo objektu izpilde

Novērojamais tiek izpildīts, kad tas ir abonēts. Parasti novērotājam tiek paziņotas trīs metodes:

Nākamais(): Šo metodi izmanto, lai nosūtītu tādas vērtības kā skaitlis, virkne, objekts utt.

Fredijs Merkūrijs

pabeigts (): Šī metode nesūta nekādu vērtību. Tas norāda, ka novērojamais ir pabeigts.

kļūda (): Šo metodi izmanto, lai paziņotu par kļūdu, ja tāda ir.

Apskatīsim piemēru, kurā esam izveidojuši novērojamo ar visiem trim paziņojumiem, un izpildīsim šo piemēru:

fails 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.')); 

Kļūdas metode tiek izsaukta tikai tad, ja ir kļūda. Palaižot iepriekš minēto kodu, konsolē redzēsit šādu izvadi.

Izvade:

RxJS novērojamie