js状态模式之我见

        js的设计模式两年前就开始接触了,起初只是跟着张容铭小哥的《JavaScript设计模式》学学js的面向对象,闭包的使用,继承封装这些基础。

        刚开始学设计模式的时候总觉得项目中用不上啊,我直接if else for循环个好几遍写好逻辑就好了呀。然而当我成为一名在互联网公司混迹多年的老菜鸟,我发现同样是一段业务,有的人就能把它写成诗,有些人就会把它写成屎。

        说的有点多了,还是回到主题吧,这一篇好好分享一下我对状态模式的理解。

        我对他的第一感觉是,当一个对象内充满了对各种不同状态而做出的不同逻辑变化,避免堆砌逻辑判断,说的直接点就是少写if else。

                                                                                            ——高级装逼工程师Yubble

        书中给到的实例是这样的:

        可以看到这就是在下还是一只小菜鸡时候的编码风格,当我的状态码越来越多,我这个ShowResult方法会越来越长,照这个路子写我else if就得这么一直加下去。我的业务倒也没什么毛病,功能也能实现,照样儿跟老板交差领工资。

        但是!如果等到这个项目业务够大了。ShowResult这个方法变得特别庞大,其中光一个else if (result == 1) {} 的代码块就十好几行,这个时候我们增删改查一块状态逻辑的成本可就上去了,这个时候如果项目中来个新同学绝对看哭啊。

        所以书中给到的解决方案是这样的:

        作者用了个自执行的函数做了个闭包,返回了一个对象,这个对象有一个show方法...算了太简单了,自行体会吧~

        但是有一个地方在下一定要多嘴一句,很多客爷分不清状态模式和策略模式,因为这两种设计模式都是在减少if else的编写量,可以说核心思想是一致的。不过如果要仔细分辨还是有几点区别的,不过在下这节不讲~🤖🤖🤖🤖🤖

        不过状态模式的特点还是一定要提:

            1,一定存在状态对象和环境方法

            2,是针对一个对象的状态做的方法处理,所以方法只对当前对象有用,不可复用

      虽说是我这个老菜鸡自己意会总结的两点,但还是经过我一次次与面试官吹牛逼的淬炼过的。

      我们还是结合上面这个例子来做个深入理解吧。

        首先这部分就是我们保存的状态对象,如果在实际项目中可以把它单独写在一个js文件中,是不是形成分离了。

        光有状态我们也要有方法去调用啊,这就是调用不同状态的环境方法。

        不论哪个使用状态模式的对象,其内部一定至少包含这两个部分。       

        然后就是它的调用,因为这种设计模式对应解决的业务核心还是对象的状态,所以他也只是给对象自己用的,无法复用。


        在网上呢看到了一些实例,但是不论哪些都离不开状态与环境这两大特点。

        让我们通过两个可爱的习题来巩固一下设计思维吧~

        首先是经典的红绿灯案例。

        我的菜鸡思维:

        首先这么写肯定也没错,项目中这么用也没有毛病,但是我就是固执的想嘚瑟一下~

        上面这个红绿灯实例我把灯的三种状态单独提了出来作为status对象,将调用状态的环境方法写成了change方法,这样一个健康的状态模式思维算是出现了,但是如果真的是项目中某一个对象只有三种状态,其实没必要弄这么嘚瑟一下,工作中还是低调一点比较好...

                                        ———————————手动分割线———————————

        其次是《JS设计模式》中提到的超级玛丽

        这个案例在小可脑中可以说是刻画的入木三分,因为它也是解决了在下一段时间写h5活动页时混乱的思路和方式。

        当我们玩超级玛丽时控制的玛丽就是一个对象,如果客爷是游戏圈的应该是叫一个精灵对吧,那么我们可以通过控制玛丽的各种‘状态’:跑,跳,蹲,来过关游戏。

        身为菜鸡的我就会这么写:

        写过游戏的客爷都会深有体会,一个精灵如果就这么几个状态一点都不好玩,游戏想要好玩操作就一定要多变。所以玛丽就应该会加速,会跑跳,会变走边开枪,此时玛丽应该会很多复合状态。

        这样一条一条写下去别想找朋友结婚生孩子了,稍微有一点需求变动加班就不是一时半会儿的。

        所以可以根据刚才小可总结的状态模式两大特点来判断这个需求是否适合状态模式,首先他是一个对象且有多种私有状态,其次这个对象需要一个环境方法来对自己的状态做出变化。

        整理好了思路我们来撸个代码试试吧✍️

        首先玛丽是一个对象,他有一个私有的状态对象。

        然后为了能让玛丽改变状态,需要一个环境方法,这个方法写在原型上吧

        这个方法我写的和作者原著上不太一样,作者是通过changeStatus方法去收集精灵的状态变化,然后再通过别的方法来释放所有状态对应的方法。而在下认为,在我们按下手柄的瞬间其实就应该立刻去更改精灵状态变化。所以我将状态收集与状态执行写成了一个方法。

        所以现在通过这种状态模式的设计,我们的小玛丽(mmm)不光能在我们的命令下开枪,还能在我们同时按下方向键的时候大跳!是不是很开心啊


        状态模式就这么介绍完毕了,为什么要第一个说它呢,因为也算是用的比较广泛,同时也为了下一个备受欢迎的策略模式埋下伏笔,很多和在下一样的客爷分不清策略和状态,其实~无所谓,只要记住大体的设计思维,工作中能做到代码优化避免无效加班,管他叫什么模式呢。

        终于到了废话时间,经过在下的努力,终于找到了一家在业内还比较健康的互联网公司。在这个公司都在优化裁员的时期还在招聘的一定都是牛逼的公司,在这个狼多肉少的时期还敢裸辞的人也一定有点本事。明天就要去新公司报道了,期待能在这个地方大干一场。🤣

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,185评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,445评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,684评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,564评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,681评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,874评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,025评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,761评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,217评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,545评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,694评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,351评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,988评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,778评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,007评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,427评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,580评论 2 349

推荐阅读更多精彩内容

  • 1.埋点是做什么的 2.如何进行埋点 3.埋点方案的设计 近期常被问到这个问题,我担心我的答案会将一些天真烂漫的孩...
    lxg阅读 2,012评论 0 1
  • 1:感恩卷纸,昨天处理样品用了一篓筐卷纸,它们的存在让我可以顺利完成实验,谢谢谢谢谢谢! 2:感恩早上的蜂蜜水,早...
    车海亮阅读 126评论 0 0
  • 大一的时候失去了最好的朋友,大二的时候把最好的两个朋友介绍在一起,最后他们好的比我还好!大四的时候,依然如此,...
    浅夏MJ阅读 178评论 0 0
  • 所谓的职业道德主要是指从事某一特定职业的人在其职业活动的过程中应当遵守的行为准则。就学前教育的专业学生而言,...
    郭_a3a3阅读 1,426评论 0 0
  • 最近的操场上,多了很多训练的小朋友。 时常也会听到他们互相讨论对方报了什么项目,看着他们脸上阳光的笑容,我总会想起...
    Miracle_Xu阅读 650评论 0 5