10个每个开发人员都喜欢的JavaScript模式

1、构造器模式

在面向对象的编程语言中,构造函数是一种特殊的方法,用于在为其分配了内存后初始化新创建的对象。在JavaScript中,几乎所有东西都是对象,我们最常对对象构造函数感兴趣。

例如,由于对象构造函数用于创建特定类型的对象,因此准备对象以供使用和接受参数时,构造函数可在首次创建对象时用来设置成员属性和方法的值。

![](//upload-images.jianshu.io

1、构造器模式

在面向对象的编程语言中,构造函数是一种特殊的方法,用于在为其分配了内存后初始化新创建的对象。在JavaScript中,几乎所有东西都是对象,我们最常对对象构造函数感兴趣。

例如,由于对象构造函数用于创建特定类型的对象,因此准备对象以供使用和接受参数时,构造函数可在首次创建对象时用来设置成员属性和方法的值。

如我们所见,JavaScript不支持类的概念,因此在构造函数内部,此关键字引用正在创建的新对象并重新访问对象创建,基本的构造函数可能如下所示:

2、moModuleattern

模块是任何健壮的应用程序体系结构中不可或缺的一部分,通常有助于保持项目代码单元的清晰分离和组织实现模块有多种选择。

这些包括:

对象文字符号

模块模式

AMD模块

CommonJS模块

ECMAScript Harmony模块

对象文字:

模块模式:

让我们开始通过创建一个独立的模块来研究Module模式的实现。

3、显示模块模式

显示模块可以做的一件事是,当我们要从另一个对象调用一个公共方法或访问公共变量时,避免重复主对象的名称。

4、单例模式

这样就知道了Singleton模式,因为它将类的实例化限制为单个对象。单例不同于静态类,因为我们可以延迟其初始化。通常,因为它们需要一些在初始化期间可能不可用的信息。对于不知道先前引用它们的代码,它们没有提供易于检索的方法。让我们看一下单例的结构:

5、观察者模式

观察者是一种设计模式,其中对象根据观察者维护对象列表,并自动将状态的任何更改通知它们。

学科

维护观察者列表,添加或删除观察者的设施

观察者

为需要通知受试者状态变化的对象提供更新的接口

具体主题

向状态观察者广播通知,存储具体观察者的状态

具体观察者

存储对ConcreteSubject的引用,为观察者实现更新的接口,以确保状态与主题一致

当主题需要将一些有趣的事情通知观察者时,它会向观察者广播通知(包括与通知主题相关的特定数据)

当我们不再希望特定观察者通过其注册的主题来通知其更改时,该主题可以将其从观察者列表中删除。将来,我将更多地讨论如何在JavaScript中广泛使用观察者的功能。

6、中介者模式

如果系统之间组件之间的直接关系过多。该组件就是可以通过控件进行通信的中心点了。中介体模式通过确保组件而不是彼此明确引用来促进松散耦合。

7、原型模式

使用Prototype模式的好处之一是,我们已经利用JavaScript原生提供的原型优势,而不是尝试模仿其他语言的功能。让我们看一下模式示例。

8、工厂模式

Factory可以提供用于创建对象的通用接口,我们可以在其中指定希望创建的工厂对象的类型。

请参见下图。

9、Mixin模式

混合类是提供功能的类,这些功能可以由子类或子类组轻松继承以进行功能复用。

在这种情况下,超级英雄能够用特定于其对象的值覆盖任何继承的值。

10、装饰器模式

装饰器是一种结构设计模式,旨在促进代码重用。与Mixins相似,它们可以被认为是对象子类化的另一种可行选择。传统上,装饰器提供了将行为动态添加到系统中现有类的功能。这个是装饰器本身不该有的基本功能。让我们看看它市如何在JavaScript中进行工作的。

所有模式都可能不适用于一个项目,并且某些项目可能会受益于Observer模式提供的去耦收益。也就是说,一旦我们牢牢掌握了设计模式及其最适合的解决特定问题的技巧的话,将它集成到我们的应用程序体系结构中变得更加容易。

专门建立的学习Q-q-u-n ⑦⑧④-⑦⑧③-零①② 分享学习方法和需要注意的小细节,互相交流学习,不停更新最新的教程和学习技巧(网页制作,网站开发,web开发,从0基础开始的的HTML+CSS+JavaScript。jQuery,Ajax,node,angular框架等到移动端HTML5的项目实战【视频+工具+系统路线图】全栈工程师学习路线以及规划都有整理,分享给小伙伴)点:学习前端,我们是认真的

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值