分层状态机（HSM）及其前端实现

class State {
  constructor(config = {}, parent = null) {
    const { id, from = '*', onEnter, onExit } = config;
    this.id = id;
    if (isString(from)) {
      if (from === '*') {
        this.acceptFromAll = true;
      } else {
        this.from = [from];
      }
    } else if (isArray(from)) {
      this.from = from;
    }
    this.onEnter = isFunction(onEnter) ? onEnter : noop;
    this.onExit = isFunction(onExit) ? onExit : noop;
    this._parent = null;
    this.children = [];
    this.setParent(parent);
  }
  
  get parent() { return this._parent; }
  get root() {
    let node = this;
    while (node._parent instanceof State) {
      node = node._prarent;
    }
    return node;
  }
  get isRoot() { return this === this.root; }
  get ancestors() {
    const ancestors = [];
    let node = this._parent;
    while (node.parent instanceof State) {
      ancestors.push(node);
      node = node.parent;
    }
    return ancestors;
  }
  
  setParent(parent) {
    if (!(parent instanceof State)) return;
    if (parent.ancestors.indexOf(this) > -1) {
      throw new Error(`cannot set child state ${parent.id} as parent`)
    }
    if (this.parent instanceof State && this.parent !== parent) {
      this.parent.removeChild(this);
    }
    this._parent = parent;
    parent.children.push(this);
  }
  
  removeChild(child) {
    removeFrom(this.children, child);
    child._parent = null;
  }
}

module.exports = State;

const State = require('./state');
const EVENTS = {
  TRANSITION_COMPLETE: 'TRANSITION_COMPLETE',
  TRANSITION_DENIED: 'TRANSITION_DENIED',
};
class StateMachine extends EventEmitter {
  static EVENTS = EVENTS;
  static State = State;
  
  constructor() {
    super();
    this._states = {};
    this._currentState = null;
  }
  
  get states() { return this._states; }
  get currentState() { return this._currentState; }
  
  hasState(id) { return keys(this.states).indexOf(id) !== -1; }
  getStateById(id) { return this.states[id] || null; }
  
  addState(data = {}, parent = null) {
    const { id } = data;
    if (this.hasState(id)) {
      throw new Error(`state ${id} exists`);
    }
    parent = parent instanceof State ? parent : this.getStateById(parent);
    const state = new State(data, parent);
    this._states[id] = state;
  }
  
  setInitialState(id) {
    if (isNil(this._currentState) && this.hasState(id)) {
      this._currentState = id;
      const state = this._states[id];
      // invoke onEnter call for all ancestors down from
      // root parent of the state we're transitioning into
      const { root, ancestors, onEnter } = state;
      if (!isNil(root)) {
        ancestors.forEach((ancestor) => {
          if (isFunction(ancestor.onEnter)) {
            ancestor.onEnter.call(this, {
              toState: id,
            });
          }
        });
      }
      // invoke onEnter call for id
      if (isFunction(onEnter)) {
        onEnter.call(this, {
          currentState: id,
        });
      }
      this.emit(EVENTS.TRANSITION_COMPLETE, {
        toState: id,
      });
    }
  }

  canChangeStateTo(id) {
    // FIXME: allow from itself?
    if (id === this._currentState) return false;
    const toState = this.getStateById(id);
    if (toState.acceptFromAll) return true;
    if (toState.from.indexOf(this._currentState) > -1) return true;
    return false;
  }

  changeState(id) {
    if (!this.hasState(id)) {
      console.warn(`cannot make transition. state: ${id} is not defined`);
      return;
    }
    const toState = this.getStateById(id);
    if (!this.canChangeStateTo(id)) {
      console.warn(`transition to state: ${id} is denied`);
      this.emit(EVENTS.TRANSITION_DENIED, {
        fromState: this._currentState,
        toState: id,
        allowedStates: toState.from,
      });
      return;
    }
    // invoke onExit callback for current state and it's ancestors
    // TODO: exceptions: if the target state is still in the same parent,
    // do not invoke onExit callback of the parent state
    const { currentState } = this;
    const allExitingStates = [currentState, ...currentState.ancestors];
    for (let i = 0; i < allExitingStates.length; i += 1) {
      const state = allExitingStates[i];
      if (isFunction(state.onExit)) {
        state.onExit.call(this, {
          currentState: state.id,
        });
      }
    }
    // invoke onEnter callback for target state and it's ancestors
    const allEnteringStates = [toState, ...toState.ancestors];
    for (let i = (allEnteringStates.length - 1); i > -1; i -= 1) {
      const state = allEnteringStates[i];
      if (isFunction(state.onEnter)) {
        state.onEnter.call(this, {
          currentState: state.id,
        });
      }
    }
    const oldState = this._currentState;
    this._currentState = id;
    this.emit(EVENTS.TRANSITION_COMPLETE, {
      fromState: oldState,
      toState: id,
    });
  }
}

module.exports = StateMachine;

// 播放器状态机示例
const eventSM = new HSM();
eventSM.addState({ id: 'playing' });
eventSM.addState({ id: 'stopped' });
eventSM.addState({ id: 'paused', from: 'playing' });
eventSM.setInitialState('stopped');
// ...