状态模式

栏目: 后端 · 发布时间: 4年前

内容简介:在状态模式(State Pattern)中,类的行为是基于它的状态改变的。这种类型的设计模式属于行为型模式。允许对象在内部状态发生改变时改变它的行为,对象看起来好像修改了它的类我们使用es6实现一个类的创建, 便于我们多个地方重复使用,其实状态模式是要根据你的状态

状态模式

在状态模式(State Pattern)中,类的行为是基于它的状态改变的。这种类型的 设计模式 属于行为型模式。

意图主要解决

允许对象在内部状态发生改变时改变它的行为,对象看起来好像修改了它的类

优点

  • 封装了转换规则。
  • 枚举可能的状态,在枚举状态之前需要确定状态种类。
  • 将所有与某个状态有关的行为放到一个类中,并且可以方便地增加新的状态,只需要改变对象状态即可改变对象的行为。
  • 允许状态转换逻辑与状态对象合成一体,而不是某一个巨大的条件语句块。
  • 可以让多个环境对象共享一个状态对象,从而减少系统中对象的个数。

缺点

  • 状态模式的使用必然会增加系统类和对象的个数。
  • 状态模式的结构与实现都较为复杂,如果使用不当将导致程序结构和代码的混乱。
  • 状态模式对"开闭原则"的支持并不太好,对于可以切换状态的状态模式,增加新的状态类需要修改那些负责状态转换的源代码,否则无法切换到新增状态,而且修改某个状态类的行为也需修改对应类的源代码。

状态模式实现

  1. class Menu

我们使用es6实现一个类的创建, 便于我们多个地方重复使用,其实状态模式是要根据你的状态

class Menu{
    }
  1. 状态对象

创建一个状态对象或者数组,内部保存状态变量,然后内部封装好每种动作对应的状态,然后状态对象返回一个接口对象,它可以对内部的状态修改或者调用。

this.menuStates = {
        hide:function () {
            console.log("hide")
        },
        show: function () {
            console.log("show")
        },
        left: function () {
            console.log("left")
        },
        right: function () {
            console.log("right")
        }
    }

上面就是我们的状态对象,一共有四个状态函数,做出不同的操作和实现

  1. 具体的使用函数

触发我们要执行的状态,state是我要传递callback函数参数,我们会根据传递的函数进行调用执行它,当然在执行过程当中

我们还可以设定使用其它的抽象类,以达到我们想要的单一原则,不要在乎是不是这样写比以前那样代码还多了,

确实会多,但是复用的时候你再看看是否还会再那么的繁琐以及更多的代码编写

toggle (state) {
        state()
    }

代码组合实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
class Menu {
    constructor(state){
        this.num = 1
        this.menuStates = {
            hide:function () {
                console.log("hide")
            },
            show: function () {
                console.log("show")
            },
            left: function () {
                console.log("left")
            },
            right: function () {
                console.log("right")
            }
        }
    }
    toggle (state) {
        state()
    }
}

    var menu = new Menu()
    console.log(menu)
    menu.toggle(menu.menuStates.show)
    menu.toggle(menu.menuStates.hide)
</body>
<script>

</script>
</html>

状态模式

上面图片就是我们得到的结果我们会发现menu构造函数是拥有四个状态函数,我们通过使用toggle函数来调用我们的函数,其实说白了状态模式相对于其它模式还是比较简单的,但是对于它的使用场景你要了解,你是否可以真正的运用它,以及把它放在适用的场景上。


以上所述就是小编给大家介绍的《状态模式》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

认知盈余

认知盈余

[美] 克莱·舍基 / 胡泳、哈丽丝 / 中国人民大学出版社 / 2011-12 / 49.80元

“互联网革命最伟大的思考者”克莱•舍基 继《未来是湿的》之后最新力作 看自由时间如何变革世界的未来 如果说《未来是湿的》揭示的是“无组织的组织力量”, 那么《认知盈余》揭示的就是 “无组织的时间力量”。 腾讯董事会主席兼首席执行官马化腾首度亲笔作序倾情推荐 克莱•舍基说,美国人一年花在看电视上的时间大约2 000亿个小时,而这几乎是2 000个维基百科项目一年所需要的......一起来看看 《认知盈余》 这本书的介绍吧!

RGB CMYK 转换工具
RGB CMYK 转换工具

RGB CMYK 互转工具

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具