Centralized system for interacting components with each other

Question

I read StackOverflow for many years, but I finally have a problem that I need help with, I can’t find the correct answer.

Current situation: I have a library of custom JS components (for example, grid, datepicker, popup, etc.). For the components to interact with each other, I implemented the pub / sub mechanism based on the following two rules: publisher: event → message subscriber: message → event

in addition to this, I use quite a few custom events configured using jQuery, and there is a way (using data attributes) to determine for each component which event should be fired when loading.

for example: the grid fires the event “initialize” at boot, “initializes” the “update” triggers, etc.

now, I can have a datepicker that also starts to “initialize” on boot, a problem occurs when the datepicker posts a message that the “Refresh” grid event is subscribed to. what happens then:

• datepicker 'initialize' starts at boot
• when initialized, the value changes, which causes the event 'change
• the 'change' event posts a message, let 'date_changed'
• the grid listens for the message and fires the 'refresh

"" "initialize" , , ,

- , , , JavaScript ,

: , ? ,

Answer 1

jquery , ? , , . , jquery, "" Grid: "gridInitialzed". Grid. , , date_changed ( - , ) . Grid "initialize", "gridInitialized.resolve()".

The grid handler for the "date_changed" event contains:

    gridInitialized.done(function() {
       *code that eventually fires the grid "refresh" event*
    });

, .done, , gridInitialized . , .resolve. .