Console punto blog

Los observables (RXJS) explicados para un niño de 5 años

Los observables son como regalos. Un regalo puede ser cualquier cosa, como un juguete, un dulce o una pelota. En el caso de los observables, el “regalo” puede ser cualquier cosa que pase en tu aplicación, como un clic en un botón, un cambio en una página o una respuesta de un servidor.

Pero aquí viene lo interesante: en lugar de abrirlo solo una vez y ya está, los observables te permiten abrirlo una y otra vez, cada vez que algo importante suceda.

Imagina que tienes una caja de regalos y cada vez que alguien haga clic en un botón, te dan un regalo. Cada vez que recibes un regalo, puedes abrirlo y hacer algo con él, como jugar con el juguete o comer el dulce. Con los observables, puedes hacer lo mismo, pero con cualquier cosa que pase en tu aplicación.

Ejemplo de observable en JavaScript

import { fromEvent } from 'rxjs';

const button = document.querySelector('button');

const click$ = fromEvent(button, 'click');

click$.subscribe(() => {
  console.log('Button was clicked!');
});

En este ejemplo, estamos creando un observable a partir de un evento de clic en un botón. Usamos la función fromEvent de RxJS para crear el observable y le decimos qué botón y qué evento de clic queremos observar.

Luego, suscribimos el observable a click$ usando el método subscribe. Cada vez que el usuario haga clic en el botón, se ejecutará la función que hemos proporcionado dentro de subscribe y se imprimirá en la consola el mensaje “Button was clicked!”.

¿Te has quedado con ganas de más?

×