Mediate and share data between different modules

Viewed 455

I am just trying to get my head around event driven JS, so please bear with me. There are different kinds of modules within my app. Some just encapsulate data, others manage a part of the DOM. Some modules depend on others, sometimes one module depends on the state of multiple other modules, but I don't want them to communicate directly or pass one module to the other just for easy access. I tried to create the simplest scenario possible to illustrate my problem (the actual modules are much more complex of course):

I have a dataModule that just exposes some data:

var dataModule = { data: 3 };

There is a configModule that exposes modifiers for displaying that data:

var configModule = { factor: 2 };

Finally there is a displayModule that combines and renders the data from the two other modules:

var displayModule = {
  display: function(data, factor) {
    console.log(data * factor);
  }
};

I also have a simple implementation of pub-sub, so I could just mediate between the modules like this:

pubsub.subscribe("init", function() {
  displayModule.display(dataModule.data, configModule.factor);
});
pubsub.publish("init"); // output: 6

However this way I seem to end up with a mediator that has to know all of the module-instances explicitly - is there even a way to avoid that? Also I don't know how this would work if there are multiple instances of these modules. What is the best way to avoid global instance-variables? I guess my question is what would be the most flexible way to manage something like that? Am I on the right track, or is this completely wrong? Sorry for not being very precise with my question, I just need someone to push me in the right direction.

2 Answers
Related