JavaScript设计模式浅谈.pdf

目 录 前言 JavaScript设计模式Item 1—多态 JavaScript设计模式 Item 2 -- 接口的实现 JavaScript设计模式 Item 3 --封装 JavaScript设计模式 Item 4 --继承 JavaScript设计模式 Item 5 --链式调用 JavaScript设计模式 Item 6 --单例模式Singleton JavaScript设计模式 Item 7 --策略模式Strategy 本文档使用 看云 构建 - 2 - 前言 前言 原文出处 ：JavaScript设计模式浅谈 作者 ： 本系列文章经作者授权在看云整理发布 ，未经作者允许 ，请勿转载 ！ JavaScript设计模式浅谈 本专栏主要介绍包括接口、封装、继承、单体模式、工厂模式、桥接模式、组合模式、门 面模式等一些JavaScript的常见的模式。 本文档使用 看云 构建 - 3 - JavaScript设计模式Item 1—多态 JavaScript设计模式Item 1—多态 多态的实际含义是 ：同一操作作用于不同的对象上面 ，可以产生不同的解释和不同的执行结 果。换句话说 ，给不同的对象发送同一个消息的时候 ，这些对象会根据这个消息分别给出不 同的反馈。 从字面上来理解多态不太容易 ，下面我们来举例说明一下。 主人家里养了两只动物 ，分别是一只鸭和一只鸡 ，当主人向它们发出 “叫”的命令时 ，鸭 会 “嘎嘎嘎”地叫 ，而鸡会 “咯咯咯”地叫。这两只动物都会以自己的方式来发出叫声。它 们同样 “都是动物 ，并且可以发出叫声” ，但根据主人的指令 ，它们会各自发出不同的叫 声。 其实 ，其中就蕴含了多态的思想。下面我们通过代码进行具体的介绍。 1. 一段 “多态”的JavaScript代码 我们把上面的故事用JavaScript代码实现如下 ： var makeSound function( animal ){ if ( animal instanceof Duck ){ console.log( '嘎嘎嘎 ' ); }else if ( animal instanceof Chicken ){ console.log( '咯咯咯 ' ); } }; var Duck function(){}; var Chicken function(){}; makeSound( new Duck() ); //嘎嘎嘎 makeSound( new Chicken() ); //咯咯咯 这段代码确实体现了 “多态性” ，当我们分别向鸭和鸡发出 “叫唤”的消息时 ，它们根据此 消息作出了各自不同的反应。但这样的 “多态性”是无法令人满意的 ，如果后来又增加了一 只动物 ，比如狗 ，显然狗的叫声是 “汪汪汪” ，此时我们必须得改动makeSound函数 ，才 能让狗也发出叫声。修改代码总是危险的 ，修改的地方越多 ，程序出错的可能性就越大 ，而 且当动物的种类越来越多时 ，makeSound有可能变成一个巨大的函数。 多态背后的思想是将 “做什么”和 “谁去做以及怎样去做”分离开来 ，也就是将 “不变的事 物”与 “可能改变的事物”分离开来。在这个故事中 ，动物都会叫 ，这是不变的 ，但是不同 本文档使用 看云 构建 - 4 - JavaScript设计模式Item 1—多态 类型的动物具体怎么叫是可变的。把不变的部分隔离出来 ，把可变的部分封装起来 ，这给予 了我们扩展程序的能力 ，程序看起来是可生长的 ，也是符合开放-封闭原则的 ，相对于修改代 码来说 ，仅仅增加代码就能完成同样的功能 ，这显然优雅和安全得多。 2. 对象的多态性 下面是改写后的代码 ，首先我们把不变的部分隔离出来 ，那就是所有的动物都会发出叫声 ： var m