divsel

Vanilla JS State Management Example

probably don't use this in production :)

Open the console and observe the output.

The files load in this order.

state.js

The state manager and the state factory are initialized. The manager is stored in the factory, and the factory is stored in the window object. It's important to note the singleton design makes it impossible for there to be more than once instance of the manager, ensuring that the values accessed from it are the ones from the correct instance.

script.js

We're able to test out the features, store, and update some states. If we try to access anything that isn't there, we will get an error.

We also demonstrate two different types of state can be built with the same factory. One type, "ro", cannot be updated without throwing an error. The factory has a manage method which is a shortcute for creating a state and updating the manager.

script2.js

We can access values stored from script.js in script2.js