Design Patterns

Olá, eu fiz os cursos de JS já faz um tempo e não me lembro se tinha design patterns, acho que tinha algo de proxy, mas não lembro do padrão observer.

Eu estou estudando na faculdade com Python, mas estou acostumada com JS, achei na internet a respeito, mas a minha dúvida é se quando faz um notify, ele está usando a função update do objeto ou da classe observer.

É uma pergunta meio estranha, mas eu fiquei pensando nisso, de onde ele está puxando a função update ou no outro exemplo o observer(data)?

Sites: https://codepen.io/pawelgrzybek/pen/XaVRyY?editors=1111

https://medium.com/@patrickackerman/the-observer-pattern-with-vanilla-javascript-8f85ea05eaa8

function Model(){
  var self = this;
  this.heading = "Hello";
  //collection of observers 
    this.observers = []; 
  //add to the collection of observers
  this.registerObserver = function(observer){
    self.observers.push(observer);
  }
  //Iterate over observers, calling their update method
  this.notifyAll = function(){
    self.observers.forEach(function(observer){
      observer.update(self);
    })
  }
}

function View(controller){
    this.controller = controller; 
    this.heading = document.getElementById(‘heading’);
    this.heading.addEventListener('click', controller);
    this.update = function(data){
         this.heading.innerText = data.heading;
    }
    this.controller.model.registerObserver(this);
}

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

  subscribe(f) {
    this.observers.push(f);
  }

  unsubscribe(f) {
    console.log(f)
    this.observers = this.observers.filter(subscriber => subscriber !== f);
  }

  notify(data) {
    this.observers.forEach(observer => observer(data));
  }
}

//código restante no link...

input.addEventListener('keyup', e => {
  headingsObserver.notify(e.target.value);
});