Finite-state machine example in JavaScript

What is Finite-state machine?

Context

FSM refers to classes of automata

The finite state machine (FSM) is a software design pattern where a given model transitions to other behavioral states through external input.

Ex…


This content originally appeared on DEV Community and was authored by Artem

What is Finite-state machine?

Context

FSM refers to classes of automata

Classes of automata: wiki

The finite state machine (FSM) is a software design pattern where a given model transitions to other behavioral states through external input.

Example using if else

Let's say we have a simple task where we check, for example, a traffic light and perform actions depending on the current state.

function trafficLightAction(color) {
  if (color === 'green') {
    console.log('Go');
  } else if (color === 'yellow') {
    console.log('Slow down');
  } else if (color === 'red') {
    console.log('Stop');
  } else {
    console.log('Invalid color');
  }
}

// Function call examples
trafficLightAction('green');  // Return: Go
trafficLightAction('yellow'); // Return: Slow down
trafficLightAction('red');    // Return: Stop
trafficLightAction('blue');   // Return: Invalid color

Example with using Finite-state machine (FSM)

Now let's implement the same functionality using a state machine. A state machine will be an object where each key (state) is associated with a specific action.

const trafficLightFSM = {
  green: () => console.log('Go'),
  yellow: () => console.log('Slow down'),
  red: () => console.log('Stop'),
  invalid: () => console.log('Invalid color'),
};

function trafficLightActionFSM(color) {
  const action = trafficLightFSM[color] || trafficLightFSM['invalid'];
  action();
}

// Function call examples
trafficLightActionFSM('green');  // Return: Go
trafficLightActionFSM('yellow'); // Return: Slow down
trafficLightActionFSM('red');    // Return: Stop
trafficLightActionFSM('blue');   // Return: Invalid color

Now, our traffic light will works well.

Disclaimer:
Several levels of additional tests would not hurt here, and perhaps another programming language ;)

Traffic light


This content originally appeared on DEV Community and was authored by Artem


Print Share Comment Cite Upload Translate Updates
APA

Artem | Sciencx (2024-07-02T21:08:16+00:00) Finite-state machine example in JavaScript. Retrieved from https://www.scien.cx/2024/07/02/finite-state-machine-example-in-javascript/

MLA
" » Finite-state machine example in JavaScript." Artem | Sciencx - Tuesday July 2, 2024, https://www.scien.cx/2024/07/02/finite-state-machine-example-in-javascript/
HARVARD
Artem | Sciencx Tuesday July 2, 2024 » Finite-state machine example in JavaScript., viewed ,<https://www.scien.cx/2024/07/02/finite-state-machine-example-in-javascript/>
VANCOUVER
Artem | Sciencx - » Finite-state machine example in JavaScript. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2024/07/02/finite-state-machine-example-in-javascript/
CHICAGO
" » Finite-state machine example in JavaScript." Artem | Sciencx - Accessed . https://www.scien.cx/2024/07/02/finite-state-machine-example-in-javascript/
IEEE
" » Finite-state machine example in JavaScript." Artem | Sciencx [Online]. Available: https://www.scien.cx/2024/07/02/finite-state-machine-example-in-javascript/. [Accessed: ]
rf:citation
» Finite-state machine example in JavaScript | Artem | Sciencx | https://www.scien.cx/2024/07/02/finite-state-machine-example-in-javascript/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.