Custom Events with RxJS

Publisher-subscriber event model on top of Reactive Programming.

Event-Based Programming is natural to any GUI based interface. HTML DOM offers inbuilt Event Notification model, but it is only useful when you are dealing with DOM Elements. There is no support for non-DOM elements.

Web applications have grown up in complexity with time; also, Javascript started participating in backend applications; which in turn made the world to see Javascript as more than HTML DOM manipulation gig.

This article showcases building up custom event publisher-subscriber model on top of Reactive Programming for non-DOM elements.


RxJS is a reactive programming extension for Javascript. Reactive Programming is a trending paradigm these days. It is the processing of streams of data asynchronously. At core, reactive streams are written on top of the event-driven paradigm (?). You are going to build an event notification model on top of it by modelling events as a stream of data.


Problem Statement

Consider modelling Thermostat, when room temperature crosses a certain threshold (30°C), AC would turn up, and windows would close.

Design

Consider class Thermostat which encapsulates the logic of monitoring and publishes events:

  • above: when temperature crossed above 30°C (threshold) from lower value.

  • below: when temperature crossed below or equal to 30°C (threshold) from higher value.

Read Full Article