The observer pattern is a behavioral design pattern in which an object, called the subject, maintains a list of its dependents, called observers, and notifies them automatically of any state changes by calling one of their methods
Build a Weather Station backend service that will publish temperature updates to multiple front-end & IoT displays
I need to turn
on when its
We need to display latest tempreture
export class TemperatureDisplay {
update(temperature) {
console.log(
"TemperatureDisplay: Understood! My display is now showing ",
temperature
);
}
}
export class Fan {
update(temperature) {
if (temperature > 25) {
console.log("Fan: Its hot here, turning myself on...");
} else {
console.log("Fan: Its nice and cool, turning myself off...");
}
}
}
export class WeatherStation {
constructor(display1, display2, fan) {
this.temperature = 20;
this.display1 = display1;
this.display2 = display2;
this.fan = fan;
}
setTemperature(temp) {
console.log("WeatherStation: new temperature measurement: ", temp);
this.temperature = temp;
// manually update other displays here
this.display1.update(temp);
this.display2.update(temp);
this.fan.update(temp);
}
}
import { WeatherStation, TemperatureDisplay, Fan } from "./no-pattern";
const display1 = new TemperatureDisplay();
const display2 = new TemperatureDisplay();
const fan = new Fan();
const weatherStation = new WeatherStation(display1, display2, fan);
weatherStation.setTemperature(30);
interface Subject {
registerObserver(o: Observer): void;
removeObserver(o: Observer): void;
notifyObservers(): void;
}
interface Observer {
update(temperature: number): void;
}
export class WeatherStation implements Subject {
private observers: Observer[] = [];
private temperature: number;
registerObserver(o: Observer) {
this.observers.push(o);
}
removeObserver(o: Observer) {
let index = this.observers.indexOf(o);
this.observers.splice(index, 1);
}
notifyObservers() {
for (let observer of this.observers) {
observer.update(this.temperature);
}
}
setTemperature(temp: number) {
console.log("WeatherStation: new temperature measurement: ", temp);
this.temperature = temp;
this.notifyObservers();
}
}
export class TemperatureDisplay implements Observer {
update(temperature: number) {
console.log(
"TemperatureDisplay: Understood! My display is now showing ",
temperature
);
}
}
export class Fan implements Observer {
update(temperature: number) {
if (temperature > 25) {
console.log("Fan: Its hot here, turning myself on...");
} else {
console.log("Fan: Its nice and cool, turning myself off...");
}
}
}
import { WeatherStation, TemperatureDisplay, Fan } from "./observer";
const display1 = new TemperatureDisplay();
const display2 = new TemperatureDisplay();
const fan = new Fan();
const weatherStation = new WeatherStation();
weatherStation.registerObserver(fan);
weatherStation.registerObserver(display1);
weatherStation.registerObserver(display2);
weatherStation.setTemperature(10);