八大最常用的JavaScript设计模式

八大最常用的JavaScript设计模式

JavaScript设计模式(一)装饰器模式

先来理解一个概念 —— 构造器模式

你开了家动物园,只有两只动物,你可能会这样录入系统:

如果你的动物越来越多,对象字面量也会越来越多,这个时候构造函数可以自动创建动物对象

像 Animal 这样当新建对象的内存被分配后,用来初始化该对象的特殊函数,就叫做构造器。在 JavaScript 中,我们使用构造函数去初始化对象,就是应用了构造器模式

可以看出每个实例化后 对象( animal )属性的key (name,age) 是不变的,对应的value(空空,泰格伍兹)是变的。所以构造器将赋值过程封装,确保了每个对象属性固定,开放了取值确保个性灵活。

简单工厂模式

动物园要求根据每个动物的食性喜好来分配不同的食物。这样之前封装的Animal 就不能直接用了,我们重新封装的构造器。

根据喜好可以分配相应的

总结

工厂模式:将创建对象的过程单独封装。

应用场景:有构造函数的地方、写了大量构造函数、调用了大量的 new的情况下

JavaScript设计模式(三)单例模式

优点:适用于单一对象,只生成一个对象实例,避免频繁创建和销毁实例,减少内存占用。

缺点:不适用动态扩展对象,或需创建多个相似对象的场景。

JavaScript设计模式(四)-适配器模式

img

当电脑需要外接显示器的时候,我们都会用到下面这个东西。转换器帮助我们在不用更改笔记本接口的同时可以适配HDMI。

将转换器抽象到代码层面就是今天要介绍的适配器了。

适配器模式的作用是解决两个软件实体间的接口不兼容的问题。使用适配器模式之后,原本 由于接口不兼容而不能工作的两个软件实体可以一起工作。

适配器模式(结构型)

应用举例: 点外卖的时候有美团,饿了么可以选择,同一家店如果要对比两个平台的价格来回切换App十分不方便,作为一个Coder能用代码解决的坚决不用人力。这个时候我们就想到写个小应用对比两家的价格。

在他们openapi里找到了对应的方法,发现请求不一样,入参不一样,返回的数据结构也不一样。翻译成伪代码就是如下的状态

声明:本站部分文章及图片源自用户投稿,如本站任何资料有侵权请您尽早请联系jinwei@zod.com.cn进行处理,非常感谢!

上一篇 2022年4月27日
下一篇 2022年4月27日

相关推荐