Member-only story

Cyclic dependencies — a convenient feature of modern JavaScript

Even easier prototyping and refactoring

Marian C.
5 min readOct 27, 2021

Interacting components

Imagine a not unusual web application with several tabs whose contents are mutually dependent. When a user clicks something any of the tabs, the contents of other tabs also change.

The are several ways to enable the interaction between components. For example, an additional common parent relaying the events of its children can be inserted into the component tree. But the easiest way to enable interaction between any components is to use a shared event emitter.

Let’s imagine a code that allows two components, for example tabs, to set parameters in each other. To make the sample code shorter and the task harder, let’s also imagine that the components have to call each other immediately on the application startup, for example, because the components might independently read user’s preferences from localStorage.

Each tab is controlled by a module aggregating many dependencies. For the sample code simplicity, I represent the complex modules with modules that are tiny and to the point.

Completely independent modules

--

--

Marian C.
Marian C.

Written by Marian C.

Java, JavaScript and SQL developer. Interested in data collection and visualization.

Responses (1)