DEV Community

Cover image for Observables | Definición, Declaración y Uso, Básico
Daniel Mezagini
Daniel Mezagini

Posted on

Observables | Definición, Declaración y Uso, Básico

Todo RxJS se basa en Observables.

Definición:

Es un objeto que puede emitir valores. Puede no emitir, emitir sólo uno, o emitir N cantidad de valores.

Declaración:

const obs$ = new Observable<string>();
Enter fullscreen mode Exit fullscreen mode

obs$ - Contiene un signo $ de pesos al final. Indica que la variable es un observable.

Observable<string>(); - Se crea una instancia de Observable, donde entre signos mayor y menor viene el tipo de dato devuelto en el observable. Entre los signos < > se especifica qué es lo que está fluyendo dentro del Observable. Pueden ser textos, numeros, modelos, clases, estructuras de datos, etc. Es muy importante definir qué tipo de dato fluye en el Observable.

Emisión de valores

Esto lo hacemos a través de la función next().

const obs$ = new Observable<string>(subs => {

    subs.next("Hola");
    subs.next("Mundo");

});

obs$.subscribe(console.log);
Enter fullscreen mode Exit fullscreen mode

Salida
Salida

subs.next() - Emisión de información.

En el ejemplo, se hacen 2 emisiones a los subscriptores. "Hola" y "Mundo" que son textos.

Las emisiones se realizan siempre y cuando haya al menos un subscriber.

complete()

Este método hará que se detenga la emisión de información. Cada next() después del método complete(), ya no será emitido.

import { Observable } from 'rxjs';

// const obs$ = Observable.create(); También se puede crear así.

const obs$ = new Observable<string>(subs => {

    subs.next("Hola");
    subs.next("Mundo");

    subs.complete();

    subs.next("Cruel");

});

obs$.subscribe(console.log);
Enter fullscreen mode Exit fullscreen mode

En este ejemplo, la salida seguirá siendo la misma. La emisión después del complete() se omitirá.

Imagen de Luisella Planeta Leoni en Pixabay

Discussion (0)