DeveloperBreeze

Javascript Patterns Development Tutorials, Guides & Insights

Unlock 1+ expert-curated javascript patterns tutorials, real-world code snippets, and modern dev strategies. From fundamentals to advanced topics, boost your javascript patterns skills on DeveloperBreeze.

Advanced JavaScript Patterns: Writing Cleaner, Faster, and More Maintainable Code

Tutorial August 27, 2024
javascript

The Observer Pattern is a behavioral pattern that allows an object (the subject) to notify other objects (the observers) of state changes.

function Subject() {
    this.observers = [];
}

Subject.prototype = {
    subscribe: function(fn) {
        this.observers.push(fn);
    },
    unsubscribe: function(fnToRemove) {
        this.observers = this.observers.filter(fn => fn !== fnToRemove);
    },
    notify: function(data) {
        this.observers.forEach(fn => fn(data));
    }
};

const subject = new Subject();

function Observer1(data) {
    console.log('Observer 1:', data);
}

function Observer2(data) {
    console.log('Observer 2:', data);
}

subject.subscribe(Observer1);
subject.subscribe(Observer2);

subject.notify('Hello Observers!');
// Output:
// Observer 1: Hello Observers!
// Observer 2: Hello Observers!

subject.unsubscribe(Observer2);

subject.notify('Hello Observer 1!');
// Output:
// Observer 1: Hello Observer 1!

Read More