# 状态模式

# 参考

http://c.biancheng.net/view/1383.htmlhttps://design-patterns.readthedocs.io/zh_CN/latest/behavioral_patterns/state.html (opens new window)

http://c.biancheng.net/view/1388.html (opens new window)

# 定义

对有状态的对象，把复杂的“判断逻辑”提取到不同的状态对象中，允许状态对象在其内部状态发生改变时改变其行为。

状态模式跟策略模式非常相似，它们都有一个上下文、一些策略或者状态类，上下文把请求委托给这些类来执行，而不同之处在于，策略模式中的策略类都是平行、没有联系的，而状态模式中的状态类的行为是早已封装好的，状态之间环环相扣，客户端无需了解这些细节。

# 应用场景

状态模式在工作流或游戏等类型的软件中得以广泛使用，甚至可以用于这些系统的核心功能设计，如在政府 OA 办公系统中，一个批文的状态有多种：尚未办理；正在办理；正在批示；正在审核；已经完成等各种状态，而且批文状态不同时对批文的操作也有所差异。使用状态模式可以描述工作流对象（如批文）的状态转换以及不同状态下它所具有的行为。

# 适用场景

对象的行为依赖于它的状态（属性）并且可以根据它的状态改变而改变它的相关行为。
代码中包含大量与对象状态有关的条件语句，这些条件语句的出现，会导致代码的可维护性和灵活性变差，不能方便地增加和删除状态，使客户类与类库之间的耦合增强。在这些条件语句中包含了对象的行为，而且这些条件对应于对象的各种状态。

# 实现思路

状态模式包含以下主要角色。

环境（Context）角色：也称为上下文，它定义了客户感兴趣的接口，维护一个当前状态，并将与状态相关的操作委托给当前状态对象来处理。
抽象状态（State）角色：定义一个接口，用以封装环境对象中的特定状态所对应的行为。
具体状态（Concrete State）角色：实现抽象状态所对应的行为。

# 优点

状态模式将与特定状态相关的行为局部化到一个状态中，并且将不同状态的行为分割开来，满足“单一职责原则”。
减少对象间的相互依赖。将不同的状态引入独立的对象中会使得状态转换变得更加明确，且减少对象间的相互依赖。
有利于程序的扩展。通过定义新的子类很容易地增加新的状态和转换。

# 缺点

状态模式的使用必然会增加系统的类与对象的个数。
状态模式的结构与实现都较为复杂，如果使用不当会导致程序结构和代码的混乱。

# 代码实例

/* 模拟一个电灯开关，这个开关有一个按钮，按钮逻辑为：
如果此时灯是关闭的，按下按钮会开灯；如果此时灯是打开的，按下按钮灯会关闭。 */

class LightControl {
  state: string = 'off'
  pressed() {
    if (this.state === 'off') {
      this.state = 'on'
      console.log('开灯')
    } else {
      this.state = 'off'
      console.log('关灯')
    }
  }
}

/* 如果我们现在想在off和on之间加一个中间状态weak（弱光），我们可以在pressed方法中增加对应逻辑
虽然实现了，但是问题也很明显，pressed方法会根据需求无限膨胀，违背了开放-封闭原则。状态切换不明显，
pressed函数变得越来越难阅读，牵一发而动全身。 */

class LightControl1 {
  state: string = 'off'
  pressed() {
    if (this.state === 'off') {
      this.state = 'weak'
      console.log('弱光')
    } else if (this.state === 'weak') {
      this.state = 'strong'
      console.log('强光')
    } else if (this.state === 'strong') {
      this.state = 'off'
      console.log('关灯')
    }
  }
}

/* 用状态模式进行重构，重构后的所有状态一目了然，而且状态的切换也更加直观。
增加状态只需要增加新的类，而无需改变客户端的逻辑代码 */

// 环境类
class Context {
  offState: State
  weakState: State
  strongState: State
  currentState: State
  constructor() {
    this.offState = new OffState()
    this.weakState = new WeakState()
    this.strongState = new StrongState()
    this.currentState = this.offState
  }
  pressed() {
    this.currentState.pressed(this)
  }
  setState(state) {
    this.currentState = state
  }
}

// 抽象状态类
abstract class State {
  abstract pressed(context: Context): void
}

// 具体状态类
class OffState extends State {
  pressed(context: Context) {
    console.log('弱光')
    context.setState(context.weakState)
  }
}

class WeakState extends State {
  pressed(context: Context) {
    console.log('强光')
    context.setState(context.strongState)
  }
}

class StrongState extends State {
  pressed(context: Context) {
    console.log('关灯')
    context.setState(context.offState)
  }
}

const ctx = new Context()
ctx.pressed()
ctx.pressed()
ctx.pressed()
ctx.pressed()

/* JavaScript作为动态语言，可以很方便的通过委托来实现状态模式，我们用call绑定了函数运行时的this，
而无需像传统面向对象语言一样让一个对象持有另一个对象 */

const FSM = {
  off: {
    pressed() {
      console.log('弱光')
      this.setState(FSM.weak)
    }
  },
  weak: {
    pressed() {
      console.log('强光')
      this.setState(FSM.strong)
    }
  },
  strong: {
    pressed() {
      console.log('关灯')
      this.setState(FSM.off)
    }
  }
}

class Context2 {
  currentState: typeof FSM[keyof typeof FSM]
  constructor() {
    this.currentState = FSM.off
  }
  pressed() {
    this.currentState.pressed.call(this)
  }
  setState(state) {
    this.currentState = state
  }
}

const ctx2 = new Context2()
console.log('------')
ctx2.pressed()
ctx2.pressed()
ctx2.pressed()

← 中介者模式