前端设计模式
文章平均质量分 87
设计原则:
1.开闭原则,对修改关闭,对扩展开放;
2.单一职责
3.里氏替换原则(子类能覆盖父类,js不常用)
4.接口隔离原则(保持接口的单一独立)
5.依赖倒置原则
new_liu
这个作者很懒,什么都没留下…
展开
-
桥接模式
将抽象部分与他的实现部分分离,这样抽象化与实现化解耦,使他们可以独立的变化 应用场景:实现系统可能有多个角度分类,每一种角度都可能变化 桥接双方可以通过实现桥接口进行单方面扩展,也可以继续抽象类而单方面扩展,而之间的调用就从桥接口来作为突破口,不会受到双方扩展的任何影响 class A{ constructor(bridge){ this.bridge = bridge; }...原创 2019-10-31 17:50:39 · 105 阅读 · 0 评论 -
状态和策略模式
当一个对象的内部状态发生改变时,会导致其行为的改变,这看起来相是改变了对象 对象有自己的状态 不同状态下执行的逻辑不一样 明确状态和每个状态下执行的动作 用来减少 if else子句 //状态模式 class SuccessState{ show(){ console.log('high'); } } class WarningState{ sho...原创 2019-10-30 09:28:58 · 113 阅读 · 0 评论 -
原型模式
原型模式是一个创建型的模式 创建基类的时候,简单差异化的属性放在构造函数中,消耗资源相同的共嗯那个放在基类原型中 对象都是由函数创建,函数也是对象,so,万物皆对象,so easy !!!想哭。 let obj = {name:'aaa'} //是下列代码的语法糖: let obj = new Object(); obj.name = 'aaa' 每个函数都有一个属性 叫 prototy...原创 2019-10-30 09:37:09 · 98 阅读 · 0 评论 -
发布订阅模式
发布订阅模式-1 //jQuery callbacks原理 window.jQuery= { callbacks(){ let callbacks = []; function add(callback){ callbacks.push(callback) } function remove(cal...原创 2019-10-30 09:38:48 · 122 阅读 · 0 评论 -
外观模式和观察者模式
外观模式 该模式就是把一些复杂的流程封装成一个接口提供给外部用户更简单的使用 门面角色:外观模式的核心,它倍客户角色调用,它熟悉子系统的共嗯那个,内部根据客户角色的需求预 子系统角色:实现了子系统的功能,它对客户角色和Facade是未知的 客户角色:通过调用Facede来完成要实现的功能 class Sum{ sum(a,b){ return a+b; }...原创 2019-10-30 09:38:27 · 473 阅读 · 0 评论 -
单例模式
透明单例 有一些对象我们往往只需要一个,比如线程池、全局缓存、浏览器中的 window对象等。 function Window(name){ this.name = name; } Window.prototype.getName = function(){ console.log(this.name) } let CreateSingle = function(Const...原创 2019-10-16 14:45:00 · 175 阅读 · 0 评论