⭐️ 设计模式大类分为 创建型 结构型 行为型 好多模式呀呀 拿下重点就好 一起飞
创建型:单例 工厂 抽象工厂 建造者
结构型:代理 享元 适配器 装饰者 外观 组合 桥接
行为型:发布-订阅 观察者 策略 模版方法 状态 迭代器 职责链 中介者 命令
创建型:
💎 1.单例 Singleton Pattern 一个对象对应一个实例 一个对象只做一件事
比如vuex全局只有一个 比如window对象、document对象
手写单例模式 赋能
function proxy(fn){
let instance
let handler = {
constructor(target,args){
if(!instance){
instance = Reflect.constructor(fn,args)
}
return instance
}
}
return new Proxy(fn,handler)
}
优点 1.节约内存开支/实例化的性能开支 2. 解决对资源的多重占用 3.减小垃圾回收机制的压力
缺点 1.不容易扩展 没有接口 2. 与单一职责原则冲突 一个类应该只关注内部逻辑 而不关心外部如何实例化
使用场景 1.实例化消耗资源过多 2.需要公共状态
2.工厂 Factory Pattern 根据不同的输入返回不同的类的实例
关注产品的实例创建,创建流程封闭
优点 良好的封装 扩展性好 无需知道对象创建流程
缺点 带来了额外的系统复杂度 增加抽象性
使用场景 对象创建过程复杂 访问者无需知道具体流程
3,抽象工厂 Abstract Factory
对产品类簇的创建
优点 1.产品结构的抽离 无需知道产品的具体实现
缺点 1. 扩展新类簇产品较困难 2.增加新的类和继承关系 带来的复杂度
使用场景 一组实例有相同的结构
4.建造者
又称生成器模式,分步构建一个复杂对象,并允许按步骤构造
制造厂 以什么样的装配方式组成汽车🚗 无需关注部件生产过程
优点 1.产品的创建算法和产品组成的实现隔离,访问者无需知道产品部件实现的细节 扩展/复用性好
缺点 1. 实例的创建增加了许多额外的结构,增加了复杂度
使用场景
1.相同的方法,不同的执行顺序,产生不一样的产品
2.产品的组成部件类似,通过组装不同的组件获得不同产品
结构型
💗 1.代理 Proxy Pattern 又称委托模式 明星和经纪人的关系
实战 1.拦截器:http拦截/路由跳转拦截器
`2.正向代理:隐藏了真实客户端 反向代理:隐藏了真实服务器`
优点:起到中介和保护目标对象的作用 可扩展性 隔离性
缺点:需要判断是否引入代理模式 复杂性
2.享元 共享技术 共用的状态 几十个考生共用一个考场
优点 减少了系统中对象数量 精简内存 加快运行
缺点 引入了共享对象 结构变复杂 维护复杂
3.适配器 Adapter Pattern 又称包装器模式,转换匹配 解决类之间接口不兼容问题
例如 转接头
优点 逻辑得到复用 无需修改原有代码 扩展性 灵活
缺点 零乱
4.装饰者 Decorator Pattern
不改变原有对象 在此基础上动态增加撤回功能
5.外观 Facade Pattern
只需要与外观进行交互 对子系统内部构造无需清楚
6.组合 Composite Pattern 整体-部分
树🌲结构 文件夹结构
7.桥接 Bridge Pattern
复用部件。抽象和实现分离
行为型
💗💗💗 1.发布-订阅 一对多 多个订阅者监听一个发布者 中间有一个消息中心 订阅者和发布者之间互相不知道身份
场景 去商店订阅一双鞋 售货员用本子记录每个想要订阅鞋的顾客的电话 到货会一一通知每个顾客
手写发布订阅啦啦啦啦😢
class Publisher {
constructor(){
this._subMaps = {} //订阅者
}
subscribe(type,cb){
if(this._subMaps[type]){
if(!this._subMaps[type].includes(cb)){
this._subMaps[type].push(cb)
}
}else{
this._subMaps[type] = [cb]
}
}
unsubscribe(type,cb){
if(!this._subMaps[type] || !this._subMaps[type].includes(cb)) return
const idx = this._subMaps[type].indexOf(cb)
this._subMaps[type].splice(idx,1)
}
notify(type,...payload){
if(!this._subMaps[type]) return
this._subMaps[type].forEach(cb => cb(...payload))
}
}
💗💗💗 2.观察者 与发布订阅者模式的区别在于 互相身份透明 没有消息中心
手写观察者👀
class Subject(){
constructor(name){
this.state = 'happy'
this.observers = []
}
attach(o){
this.observers.push(o)
}
setState(newState){
this.state = newState
this.observers.forEach(o => o.update(this))
}
}
class Observer(){
constructor(name){
this.name = name
}
update(){
console.log("this.name"+"当前学生状态"+"this.state")
}
}
3.策略 Strategy Pattern 不同的道路采用不同的轮胎 有多种策略
4.模版方法 共用的流程提取出来 比如煮咖啡牛奶 步骤是一样的
5.状态 State Pattern 随着内部状态改变 类的行为也跟着改变 红绿灯
6.迭代器 -点钞机 按顺序访问 不用关心内部结构 循环 遍历
7.职责链 -请求在一系列对象中传递,形成一条链 例如作用域链 原型链 事件冒泡
8.中介者 男女相亲 媒人在中间协调沟通
9.命令 命令的发送者和接受者解藕 无需知道对方的身份