Observer Design Pattern

class Observer {
  constructor() {
    this.observers = [];
  }

  add(fn) {
    if (fn && !this.observers.includes(fn)) {
      this.observers.push(fn);
    }
  }

  remove(fn) {
    this.observers = this.observers.filter(obs => obs !== fn);
  }

  notify(key, val) {
    this.observers.forEach(fn => fn(key, val));
  }
}

const birds = {
  one: 'Cardinal',
  two: 'Blue Jay',
  three: 'Blue Bird',
};

const obs = new Observer();

const handler = {
  get(obj, key) {
    return obj[key];
  },
  set(obj, key, val) {
    obj[key] = val;
    obs.notify(key, val);
    return true;
  },
}

const birdsproxy = new Proxy(birds, handler);

const obs1 = (key, val) => console.log(`Observed subject: ${key} => ${val}`);
obs.add(obs1);
birdsproxy.one = "Blue Bird";
birdsproxy.four = "Black Bird";
obs.remove(obs1);
birdsproxy.four = "Robin";