设计模式
文章平均质量分 63
Cipuzp
这个作者很懒,什么都没留下…
展开
-
jQuery 版本购物车(融入设计模式)
jQuery 版本购物车(融入设计模式)1. 介绍1.1 功能显示购物列表、加入购物车、从购物车删除1.2 用到的设计模式工厂模式$('XXX'),创建商品单例模式购物车装饰器模式打点统计观察者模式网页事件、Promise状态模式添加/删除购物车模板方法模式init(),统一的方法渲染代理模式打折商品信息处理1...原创 2018-11-09 12:48:33 · 548 阅读 · 0 评论 -
状态模式
状态模式1. 介绍一个对象有状态变化每次状态变化都会触发一个逻辑不能总是用 if…else 来控制2. UML 演示3. 代码演示class State { constructor(color) { this.color = color } handle(context) { console.log(`turn to ${this.color} l...原创 2018-11-05 22:11:11 · 178 阅读 · 0 评论 -
迭代器模式
迭代器模式1. 介绍顺序访问一个集合使用者无需知道集合的北部结构(封装)2. UML 演示3. 代码演示class Iterator { constructor(container) { this.list = container.list this.index = 0 } next() { if (this.hasNext()) { ...原创 2018-11-05 20:56:49 · 120 阅读 · 0 评论 -
观察者模式
观察者模式1. 介绍发布订阅一对一(多)2. UML 演示3. 代码演示//观察者class Observer { constructor(name, subject) { this.name = name this.subject = subject this.subject.attach(this) } update() { co...原创 2018-11-05 12:45:05 · 116 阅读 · 0 评论 -
装饰器模式
装饰器模式1. 介绍为对象添加新功能不改变其原有的结构和功能2. UML 演示3. 代码演示class Circle { draw() { console.log('画圆形') }}class Decorator { constructor(circle) { this.circle = new Circle() } draw() { ...原创 2018-11-02 22:14:50 · 139 阅读 · 0 评论 -
适配器模式
适配器模式1. UML 演示2. 代码演示// class Client {// do() {// }// }class Adaptee { specificRequest() { return '公牛插头' }}class Target { constructor() { this.adaptee = new Adaptee() }...原创 2018-11-02 19:31:21 · 135 阅读 · 0 评论 -
单例模式
单例模式1. 特点系统中被唯一使用一个类只有一个实例单例模式需要用到 java 的特性(private)ES6 中没有(ts 除外)2. UML 演示3. 代码演示java 代码public class SingleObject{ //私有化构造函数,外部不能有 new,只能内部 new private SingleObject(){ } //唯一被 ...原创 2018-11-02 14:09:56 · 240 阅读 · 0 评论 -
工厂模式
工厂模式1. UML 描述2. 代码演示class Product { constructor(name) { this.name = name } init() { alert('init') } fn1() { alert('fn1') } fn2() { alert('fn2') }}class Creator ...原创 2018-11-02 12:33:48 · 289 阅读 · 1 评论 -
外观模式
外观模式1. 介绍为子系统中的一组接口提供了一个高层接口,使用者使用这个高层接口2. UML 演示3. 代码演示function bindEvent(elem, type, selecetor, fn) { if (fn == null) { fn = selector selector = null } //...}//调用bindEvent(...原创 2018-11-04 11:23:21 · 142 阅读 · 0 评论 -
代理模式
代理模式1. 介绍使用者无权访问目标的对象中间加代理,通过代理做授权和控制2. UML 演示3. 代码演示class RealImg { constructor(fileName) { this.fileName = fileName this.loadFromDisk() } display() { console.log('display...原创 2018-11-04 11:05:11 · 170 阅读 · 0 评论 -
SOLID 五大设计原则
SOLID 五大设计原则1. SRP 单一职责原则(The Single Responsibility Principle)一个程序只做好一件事如果功能过于复杂就开分开,每个部分保持独立2. OCP 开放封闭原则(The Open Closed Principle)对拓展开放,对修改封闭增加需求时,拓展新代码,而非修改已有代码软件设计的终极目标3. LSP 里氏置换原则(T...原创 2018-11-09 16:00:40 · 852 阅读 · 0 评论 -
23 种设计模式
23 种设计模式1. 创建型工厂模式(工厂方法模式、抽象工厂模式、建造者模式)单例模式原型模式2. 结构型适配器模式装饰器模式代理模式外观模式桥接模式组合模式享元模式3. 行为型策略模式模板方法模式观察者模式迭代器模式职责连模式命令模式备忘录模式状态模式访问者模式中介者模式解释器模式...原创 2018-11-09 12:51:54 · 173 阅读 · 0 评论 -
设计模式(不常用的几类)
设计模式1. 创建型1. 原型模式概念clone 自己,生成一个对象应用(Object.create)//基于原型创建一个对象var prototype = { getName: function() { return this.first + ' ' + this.last }, say: function() { console.log('hel...原创 2018-11-08 17:04:51 · 334 阅读 · 0 评论