听飞狐聊JavaScript设计模式系列12

  • A+
所属分类:JavaScript

本回内容介绍

上一回,聊了桥接模式,做了一道计算题;介一回,聊组合模式(Composite),官方描述组合模式将对象组合成树形结构以表示“部分-整体”的层次结构,组合模式使得用户对单个对象和组合对象的使用具有一致性。
这里我理了一下,就组合模式的特性而言:
1,组合模式把对象分为组合对象和叶子对象两种。
2,组合对象和叶子对象实现同一批操作。
3,对组合对象执行的操作可以向下传递到叶子节点进行操作。
这样做带来的好处:
1,解耦,弱化类与类之间的耦合,同样的方法得到抽离处理组合对象和叶子对象;
2,把对象组合成属性结构的对象。
这个也是我在网上看了很多描述后做的总结。这里先看一下,然后看例子,看完例子再来看总结,应该会更有心得,来吧,开始咯。

1.组合模式

这里需要用到之前写过的接口类,不清楚的童鞋看看前面聊过的系列05,这里模拟一个导航菜单,如京东的一级导航,二级导航,三级导航,代码如下:

作为第一个例子,为了便于大家理解,我基本把注释都写完了,把一下叶子对象的方法省去了,只写了一个方法,更直观方便理解。下一个例子用一个图片库来演示,走你。

2. 组合模式之图片库

图片库可以有选择地隐藏或显示图片库的全部或某一部分(单独的或是部分的)。同上面一个例子一样,一个组合类做库、一个叶子类则是图片本身,如下:

这个例子在网上很多,这里我改了下代码,使组合对象和叶子对象更直观,让这两个类来管理图片库,代码可以直接copy运行。

装个逼咯。双12大超市小铺子都在搞活动,又是一阵买买买~~

递归

官方概述程序调用自身的编程技巧称为递归( recursion)。

这里之所以用arguments.callee,好处就在于改变函数名的时候,不用再去该内部的代码,防止出错。

看完点个赞,推荐推荐咯,人气+++,动力才能+++吖,嘿嘿~~

weinxin
我的微信公众号
我的微信公众号扫一扫

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: