DEV Community


Discussion on: Turning your React Component into a Finite State Machine With useReducer

joshpitzalis profile image
Josh • Edited

Isn't the whole point of a state machine that you can only fire certain actions in certain states? I don't understand how what you presented is a state machine, you've just implemented useReducer. Please correct me if I am wrong, but unless I have missed something, this has nothing to do with a state machine.

rohanfaiyazkhan profile image
Rohan Faiyaz Khan Author

Well you are partially correct. There are many different types of state machines and the basic definition that binds all of them is that they have finite states and can only exist in one state at a time. What you are describing is called a Mealy state machine. That is a state machine where next state depends on previous state and external inputs. I have described a state machine which only depends on inputs.

The simplest way to convert it to what you want would be to do a conditional check inside the reducer.

function reducer(state, action){
   if(state === SomeState){

I do not think there is one right way to do this. Accounting for previous state is, as I've mentioned in my post, a possible model but one that adds more complexity.