← Back to design patterns map
🚥
Design Pattern

State

Change behavior when an object changes internal state.

behavioral

Visual Diagram

Order: pending
-> paid
-> shipped
-> delivered

When To Use

  • ->Order lifecycle behavior
  • ->Authentication states
  • ->Workflow state machines
  • ->UI components with state-specific behavior
Used in: Workflow engines, XState, order lifecycles
state.js

Live Editor

Loading...

Output

Run code to see output...