JavaScript状态模式_有限状态机实现

// 状态接口（约定方法）
class PlayerState {
  play(player) { throw new Error('Not implemented'); }
  pause(player) { throw new Error('Not implemented'); }
  stop(player) { throw new Error('Not implemented'); }
}

// 待机状态
class IdleState extends PlayerState {
  play(player) {
    console.log('开始播放');
    player.setState(new PlayingState());
  }
  pause(player) {
    console.log('无法暂停，当前未播放');
  }
  stop(player) {
    console.log('已经停止');
  }
}

// 播放状态
class PlayingState extends PlayerState {
  play(player) {
    console.log('已经在播放');
  }
  pause(player) {
    console.log('暂停播放');
    player.setState(new PausedState());
  }
  stop(player) {
    console.log('停止播放');
    player.setState(new IdleState());
  }
}

// 暂停状态
class PausedState extends PlayerState {
  play(player) {
    console.log('恢复播放');
    player.setState(new PlayingState());
  }
  pause(player) {
    console.log('已经是暂停状态');
  }
  stop(player) {
    console.log('停止播放');
    player.setState(new IdleState());
  }
}

// 上下文：播放器
class AudioPlayer {
  constructor() {
    this.state = new IdleState();
  }

  setState(state) {
    this.state = state;
  }

  play() {
    this.state.play(this);
  }

  pause() {
    this.state.pause(this);
  }

  stop() {
    this.state.stop(this);
  }
}

const player = new AudioPlayer();

player.play();  // 输出：开始播放
player.pause(); // 输出：暂停播放
player.play();  // 输出：恢复播放
player.stop();  // 输出：停止播放
player.pause(); // 输出：无法暂停，当前未播放

class FiniteStateMachine {
  constructor(config) {
    this.currentState = config.initial;
    this.transitions = config.transitions || {};
  }

  transition(event) {
    const nextState = this.transitions[this.currentState]?.[event];
    if (nextState) {
      this.currentState = nextState;
      console.log(`状态切换为: ${this.currentState} (通过事件: ${event})`);
    } else {
      console.warn(`不允许的转换: ${this.currentState} + ${event}`);
    }
  }

  getCurrentState() {
    return this.currentState;
  }
}

// 使用配置定义播放器 FSM
const playerFSM = new FiniteStateMachine({
  initial: 'idle',
  transitions: {
    idle:    { play: 'playing' },
    playing: { pause: 'paused', stop: 'idle' },
    paused:  { play: 'playing', stop: 'idle' }
  }
});

playerFSM.getCurrentState(); // 'idle'
playerFSM.transition('play'); // 状态切换为: playing
playerFSM.transition('pause'); // 状态切换为: paused