Js设计模式

1、简介

设计模式总的来说是一个抽象的概念,是软件开发人员在开发过程中面临的一般问题的解决方案。这些解决方案是众多软件开发人员经过相当长的一段时间的试验和错误总结出来的。

2、工厂模式

工厂模式是用来创建对象的一种最常用的设计模式。我们不暴露创建对象的具体逻辑,而是将逻辑封装在一个函数中那么这个函数就可以被视为一个工厂。

(1)简单工厂模式

Js设计模式_第1张图片

(2)工厂方法

Js设计模式_第2张图片

(3)抽象工厂模式

Js设计模式_第3张图片

3、单例模式·

一个构造函数一生只能有一个实例

不管你 new多少次,都是这一个实例

保证一个类仅有一个实例,并提供一个访问它的全局访问点。

Js设计模式_第4张图片

Js设计模式_第5张图片

Js设计模式_第6张图片

4、适配器模式

适配器用来解决两个接口不兼容的情况,不需要改变已有的接口,通过包装一层的方式实现两个接口的正常协作。

Js设计模式_第7张图片

Js设计模式_第8张图片

5、装饰模式

装饰模式不需要改变已有的接口,给对象添加额外的功能。比如使用ES7中的装饰器语法:

Js设计模式_第9张图片

6、代理模式

在某些情况下,一个对象不适合或者不能直接引用另一个对象,而代理对象可以在两个对象之间起到中介的作用。

Js设计模式_第10张图片

Js设计模式_第11张图片

7、观察者模式

定义了对象间一对多的依赖关系,当目标对象的状态发生改变时,所有依赖它的对象都会得到通知。

Js设计模式_第12张图片

Js设计模式_第13张图片

vue源码中的依赖管理和通知更新就是基于观察者模式。

Js设计模式_第14张图片

8、发布订阅模式

实现了对象间多对多的依赖关系,通过事件中心管理多个事件。目标对象并不直接通知观察者,而是通过事件中心来派发通知。

Js设计模式_第15张图片

Js设计模式_第16张图片

Js设计模式_第17张图片

9、策略模式

一个问题匹配多个解决方案,不一定要用到哪一个而且有可能随时还会继续增加多个方案

Js设计模式_第18张图片

Js设计模式_第19张图片

你可能感兴趣的:(设计模式,开发语言,javascript,ecmascript)