JavaScript state machine and its application in workflow

State machine

What is called the state machine (finite states Machine), the written explanation can be found by the search engine. Popularly speaking is a set of code that defines, finds, switches, and dispatches events. The corresponding design pattern is called state machine mode, which is often used in game programming and is used in workflow applications.

In a workflow, we often have a series of steps: Step 1, Step 2, Step 3, step 4. We first need to define these steps, and then define the conditions for these steps to switch, in the case of the client, usually some conditional validation passes, can be a field, or some interface, and the completion of the previous step.

Work flow

We need to complete a more complex task, usually requiring multiple steps, and these steps will also have preconditions and flow control, the actual business is the workflow.

Small application

For example, we have to carry out a reimbursement of the approval, there are several steps: Start, staff submitted reimbursement, Project Manager audit, the director of audit, financial approval, supplementary information.

Business is: The process is in accordance with the order to go, before the financial approval, you can supplement the information, only to supplement the information will be from the project manager to start approval.

In the traditional code, if we want to write all of the above states together, we must have a lot of if else conditions to judge. This time can use the state machine to abstract these content, to form a high degree of separation, reusability, good, understandable code.

Search in Google javascript finite state machine , the first result is the code on the GitHub, I took to do the demonstration, the details click on the demo to see it, or with the code.

Postscript

• Of course, what we have to do is not a pure front-end can be completed, the front-end is only to ensure that users in the normal use of software in the case of the correct input.
• State machine in the use of the process will be a lot of complex situation, it depends on the strong packaging code, such as the above state machine does not support child state.