一.设计模式
1.单例模式
保证一个类仅有一个实例,并提供一个访问它的全局访问点。
x.getInstance = (function(){
let instance = null
return function(name){
if(!instance){
instance = new X(name)
}
return instance
}
})()
2.策略模式
定义一系列的算法,把它们一个个封装起来,并且使他们可以相互替换,如表单校验
var strategies = {
inNonEmpty(value, errorMsg){
if(value ==='') return errorMsg
},
isMobile(){
}
}
class Validator{
constructor(){
this.cache = []
}
add(dom, rule, errorMsg){
this.cache.push(function(){
return strategies[rule].apply(dom, [dom.value], errorMsg)
})
}
start(){
for(var i = 0, validatorFunc; validatorFunc = this.cache[i++]){
let msg = validatorFunc()
if(msg) return msg
}
}
}
3.代理模式
缓存代理用于ajax异步请求数据, nginx反向代理,
4.迭代器模式
$.each
5.发布订阅
DOM事件
6.命令模式
按钮
7.组合模式
任务队列,ABC组合,一起执行
8.模板方法模式
AB两个类,提取公共到父类C,然后AB保留变化逻辑
9.享元模式
解决大量对象带来的性能问题
比如上传,通过定义工厂+闭包,避免重复创建同种类型实例
10.职责链模式
使很多对象都有机会处理请求,从而避免请求的发送者和接收者之间的耦合关系,将这些对象连成一个链,并沿着这条链传递该请求,直到有一个对象处理它为止。
如原型链,作用域链,事件冒泡
11.中介者模式
优点解耦,缺点,创建中介对象占用内存
12.装饰器模式
es8 装饰器,在不影响函数功能的情况下,对其进行包装
比如:数据上报,统计函数执行时间,动态改变函数参数
13.状态模式
14.适配器模式
解决两个已有接口之间不匹配的问题,不需要改变已有的接口,就能够使其协同作用
比如数据格式转换器
二.设计原则
1.单一职责原则
单例,装饰,迭代器,代理
2.最少知识原则
中介模式体现,对象改变时,只需通知中介对象
3.开放封闭原则
三.代码重构
1.提炼函数
避免超大,可复用,易覆写,命名语义化