状态模式将状态的切换交由具体的处理节点做判断, 容器只提供执行上下文
/**
* 处理节点类
*/
abstract class State{
state: string
next: State
constructor(state: string, next?: State){
this.state = state
this.next = next || this
}
// 状态切换方法,交由具体的子类实现
abstract change():State
}
/**
* 状态控制类
*/
class Store{
// 游标, 标记下一可调用状态
currentState: State
constructor(currentState: State){
this.currentState = currentState
}
run(){
// 修改当前游标指向
this.currentState = this.currentState.change()
}
}
/**
* 具体的状态节点类实现
*/
class Success extends State{
constructor(next?: State){
const state = 'SUCCESS'
super(state, next)
}
// 子类实现具体的状态处理
change(): State {
console.log(this.state)
return this.next
}
}
class Fail extends State{
constructor(next?: State){
const state = 'Fail'
super(state, next)
}
change(): State {
console.log(this.state)
return this.next
}
}
class Loading extends State{
success: State
fail: State
constructor(success?: State, fail?: State){
const state = 'Loading'
super(state)
this.success = success || this
this.fail = fail || this
}
change(): State {
console.log(`
---------- LOADING ----------
`)
this.next = Number.parseInt(`${Math.random() * 10}`) % 2 ? this.success : this.fail
return this.next
}
}
function stateMod(){
const success = new Success()
const fail = new Fail()
const loading = new Loading()
const store = new Store(loading)
success.next = loading
fail.next = loading
loading.success = success
loading.fail = fail
for(let i = 0; i < 10; i++){
store.run()
}
}
stateMod()
调用具体执行的函数的决策交由容器决定
// 决策容器
abstract class Strategy<T extends string>{
state: T
constructor(initState: T){
this.state = initState
}
// 状态的的切换交由的策略决策处理
abstract strategy():void
}
type State = 'success' | 'fail' | 'loading'
class LoadData extends Strategy<State>{
loading: Function
success: Function
fail: Function
constructor(loading: Function, success: Function, fail: Function){
super('loading')
this.loading = loading
this.success = success
this.fail = fail
}
strategy(){
switch (this.state) {
case 'success':
this.success()
this.state = 'loading'
break;
case 'fail':
this.fail()
this.state = 'loading'
break;
case 'loading':
this.state = this.loading() ? 'success' : 'fail'
break;
}
}
}
function StrategyMod(){
// 具体的执行不参与状态的切换
const success = () => console.log('Success')
const fail = () => console.log('Fail')
const loading = () => {
console.log(`
---------- LOADING ----------
`)
return Number.parseInt(`${Math.random() * 10}`) % 2
}
const loadData = new LoadData(
loading,
success,
fail
)
for(let i = 0; i < 10; i++){
loadData.strategy()
}
}
StrategyMod()
interface IStrategy<T>{
(s: T): T
}
type State = 'success' | 'fail' | 'loading'
/**
* 值容器
*/
class Container<T>{
state: T
constructor(state: T){
this.state = state
}
of(s: T){
return new Container(s)
}
map(cb:IStrategy<T>){
return this.of(cb(this.state))
}
}
type Warp<T extends string> = (s: T) => Warp<T>
function StrategyMod(){
// 具体的执行不参与状态的切换
const success = () => console.log('Success')
const fail = () => console.log('Fail')
const loading = () => {
console.log(`
---------- LOADING ----------
`)
return Number.parseInt(`${Math.random() * 10}`) % 2
}
// 决策函数
const loadData = function(s: State): State{
switch (s) {
case 'success':
success()
return 'loading'
case 'fail':
fail()
return 'loading'
case 'loading':
return loading() ? 'success' : 'fail'
}
}
const list = new Array(10).fill('')
list.reduce<Container<State>>((acc) => acc.map(loadData), new Container<State>('success'))
}
StrategyMod()
策略模式与状态模式,关注的是状态切换的控制权。
策略模式更中心化,状态模式更分布式。