摘要:状态模式状态模式将事物内部的每个状态分别封装成类内部状态改变会产生不同行为。将状态封装成不同类打开强光关灯打开弱光初始状态按钮非面向对象实现的状态模式借助于的委托机制可以像如下实现状态模式打开强光关灯打开弱光按钮通过完成委托
状态模式
状态模式: 将事物内部的每个状态分别封装成类, 内部状态改变会产生不同行为。
优点: 用对象代替字符串记录当前状态, 状态易维护
缺点: 需编写大量状态类对象
场景 demo
某某牌电灯, 按一下按钮打开弱光, 按两下按钮打开强光, 按三下按钮关闭灯光。
// 将状态封装成不同类 const weakLight = function(){ this.light = light } weakLight.prototype.press = function(){ console.log("打开强光") this.light.setState(this.light.strongLight) } const strongLight = function(){ this.light= light } strongLight.prototype.press = function(){ console.log("关灯") this.light.setState(this.light.offLight) } const offLight = function(){ this.light= light } offLight.prototype.press = function(){ console.log("打开弱光") this.light.setState(this.light.weakLight) } const Light = function(){ this.weakLight = new weakLight(this) this.strongLight = new strongLight(this) this.offLight = new offLight(this) this.currentState = this.offLight //初始状态 } Light.prototype.init = function(){ const btn = doucment.createElement("button") btn.innerHTML = "按钮" document.body.append(btn) const self = this btn.addEventListener("click",function(){ self.currentState.press() }) } Light.prototype.setState = function(state){ this.currentState = state } const light = new Light() light.init()非面向对象实现的状态模式
// 借助于javascript的委托机制 可以像如下实现状态模式 const obj = { "weakLight": { press: function(){ console.log("打开强光") this.currentState = obj.strongLight } }, "strongLight": { press: function(){ console.log("关灯") this.currentState = obj.offLight } }, "offLight": { press: function(){ console.log("打开弱光") this.currentState = obj.weakLight } }, } const Light = function(){ this.currentState = obj.offLight } Light.prototype.init = function(){ const btn = document.createElement("button") btn.innerHTML = "按钮" document.body.append(btn) const self = this btn.addEventListener("click",function(){ self.currentState.press.call(self) //通过call完成委托 }) } const light = new Light() light.init()
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/106899.html
摘要:什么是状态模式状态模式对象行为是基于状态来改变的。原文地址设计模式手册之状态模式优缺点优点封装了转化规则,对于大量分支语句,可以考虑使用状态类进一步封装。 1. 什么是状态模式? 状态模式:对象行为是基于状态来改变的。 内部的状态转化,导致了行为表现形式不同。所以,用户在外面看起来,好像是修改了行为。 Webpack4系列教程(17篇) + 设计模式手册(16篇):GitHub地址 博...
摘要:什么是状态模式状态模式对象行为是基于状态来改变的。原文地址设计模式手册之状态模式优缺点优点封装了转化规则,对于大量分支语句,可以考虑使用状态类进一步封装。 1. 什么是状态模式? 状态模式:对象行为是基于状态来改变的。 内部的状态转化,导致了行为表现形式不同。所以,用户在外面看起来,好像是修改了行为。 Webpack4系列教程(17篇) + 设计模式手册(16篇):GitHub地址 博...
摘要:作者按每天一个设计模式旨在初步领会设计模式的精髓,目前采用和两种语言实现。享元模式提醒我们将一个对象的属性划分为内部和外部状态。 作者按:《每天一个设计模式》旨在初步领会设计模式的精髓,目前采用javascript和python两种语言实现。诚然,每种设计模式都有多种实现方式,但此小册只记录最直截了当的实现方式 :) 个人技术博客-godbmw.com 欢迎来玩! 每周至少 1 篇原创...
摘要:作者按每天一个设计模式旨在初步领会设计模式的精髓,目前采用和两种语言实现。享元模式提醒我们将一个对象的属性划分为内部和外部状态。 作者按:《每天一个设计模式》旨在初步领会设计模式的精髓,目前采用javascript和python两种语言实现。诚然,每种设计模式都有多种实现方式,但此小册只记录最直截了当的实现方式 :) 个人技术博客-godbmw.com 欢迎来玩! 每周至少 1 篇原创...
阅读 3568·2023-04-26 02:07
阅读 3065·2021-09-22 15:55
阅读 2506·2021-07-26 23:38
阅读 3074·2019-08-29 15:16
阅读 1976·2019-08-29 11:16
阅读 1706·2019-08-29 11:00
阅读 3483·2019-08-26 18:36
阅读 3136·2019-08-26 13:32