常用的4种Web设计模式总结，帮你提升代码质量

た入场券 2023-02-23 08:28 5阅读 0赞

在许多初创公司和其他小型公司中往往需要从头开始一个项目。在开发过程中有太多的编程语言，体系结构等问题需要抉择，而这些问题往往需要设计模式来解决。

设计模式就像您的项目的模板。它使用某些约定，您可以从中期望一种特定的行为。这些模式由许多开发人员的经验组成，因此它们实际上就像是不同的最佳实践集。您和您的团队可以决定哪种最佳实践对您的项目最有用。根据您选择的设计模式，所有人知道该怎么进行代码的开发。

《设计模式-可重用的面向对象软件的元素》一书中有23种官方模式。在Web开发中，我认为有四种最重要且常见的设计模式。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW94aWppbmc_size_16_color_FFFFFF_t_70]

## 1、单例设计模式 ##

它仅允许类仅仅具有单个实例，并且使用全局变量存储该实例。您将使用延迟加载来确保该类只有一个实例，因为它只会在需要时创建该类。这样可以防止创建多个实例。大多数情况下，这是在构造函数中实现的。

数据库连接有时候我们使用的就是单例模式，通过创建连接数据库的单例模式，可以有效避免我们生成过多的数据库连接对象，避免了数据库连接开销。

## 2、策略设计模式 ##

策略设计模式，就像if else语句的高级版本。基本上，您可以在其中为基类中的方法创建接口。然后，使用此接口从派生类中找到该方法的正确实现。

一个类的行为或其算法可以在运行时更改。这种类型的设计模式属于行为型模式。

在策略模式中，我们创建表示各种策略的对象和一个行为随着策略对象改变而改变的 context 对象。策略对象改变 context 对象的执行算法。

## 3、观察者设计模式 ##

如果您曾经使用过MVC模式，那么您已经使用过观察者设计模式。观察者模式就像MVC的View部分。您有一个包含所有数据及其状态的主题。然后，您将拥有与用户一样的观察者，他们将在数据更新后从主题中提取数据。

发送用户通知，更新，筛选和处理订阅者都可以使用观察者模式来完成。

## 4、装饰器设计模式 ##

允许向一个现有的对象添加新的功能，同时又不改变其结构。这种类型的设计模式属于结构型模式，它是作为现有的类的一个包装。

这种模式创建了一个装饰类，用来包装原有的类，并在保持类方法签名完整性的前提下，提供了额外的功能。

我们通过下面的实例来演示装饰器模式的用法。其中，我们将把一个形状装饰上不同的颜色，同时又不改变形状类。

动态地给一个对象添加一些额外的职责。就增加功能来说，装饰器模式相比生成子类更为灵活。  
![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW94aWppbmc_size_16_color_FFFFFF_t_70 1]  
设计模式（Design Pattern）是前辈们对代码开发经验的总结，是解决特定问题的一系列套路。它不是语法规定，而是一套用来提高代码可复用性、可维护性、可读性、稳健性以及安全性的解决方案。

如果你还没有听说过设计模式，或者在平时的编写代码过程中很少使用策略模式，那么希望您可以从今以后多留意一下，好的设计模式一定是可以提升代码质量的。

了解更多Web开发，你可以关注我，定期发布技术文章和行业趋势分析。

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW94aWppbmc_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200706161843829.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW94aWppbmc=,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW94aWppbmc_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20200706162017898.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3hpYW94aWppbmc=,size_16,color_FFFFFF,t_70