JS单例模式和策略模式
原创
开发中，我们或多或少地接触了设计模式，但是很多时候不知道自己使用了哪种设计模式或者说该使用何种设计模式。本文意在梳理常见设计模式的特点，从而对它们有比较清晰的认知。
一个模式就是一个可重用的方案，可应用于在软件设计中的常见问题。另一种解释就是一个我们如何解决问题的模板 - 那些可以在许多不同的情况里使用的模板。
设计原则：软件设计要遵循的原则。
单一职责原则：每个类或方法只做一件事
开闭原则：对外开放，对内关闭，尽量少的去更改底层的功能，将方法暴露给外部去修改
里氏替换原则：子类继承父类，尽量不要去修改覆盖父类的方法
迪米特法则：不推荐跨层级通信（如vue中爷孙组件通信时，可以使用Vuex传递数据，不建议直接跨层级通信）
接口隔离原则：接口设计最小单元，高内聚、低耦合
依赖倒置原则：抽象出来的方法、类应该是共性的内容，而不是很细节的内容
单例模式详解
实现方式
使用闭包
单例模式的核心思想是确保类只有一个实例，并提供全局访问点。在 JavaScript 中，可以使用闭包来创建单例。
function addEvent(dom, type, fn) {
// 对于支持DOM2级事件处理程序addEventListener方法的浏览器
if (dom.addEventListener) {
dom.addEventListener(type, fn, false);
} else if (dom.attachEvent) {
// 对于不支持addEventListener方法但支持attchEvent方法的浏览器
dom.attachEvent("on" + type, fn);
} else {
// 对于不支持addEventListener方法，也不支持attchEvent方法，但支持“on”+事件名的浏览器
dom["on" + type] = fn;
}
}使用类
另一种实现单例的方法是使用 ES6 类。这种方法通过 static 关键字确保只有一个实例。
class Singleton {
constructor() {
if (!Singleton.instance) {
Singleton.instance = this;
}
return Singleton.instance;
}
// 实例的方法
}
const instance1 = new Singleton();
const instance2 = new Singleton();
console.log(instance1 === instance2); // true，两个变量引用的是同一个实例应用场景
单例模式在需要确保系统中某个类只有一个实例时非常有用。例如：
- 全局状态管理：在 Redux 或 Vuex 中，通常会使用单例模式来创建全局的状态管理实例。
- 日志记录器：当需要一个单一的日志记录器来跟踪应用程序中的日志信息时，可以使用单例模式。
- 数据库连接池：确保在整个应用程序中只有一个数据库连接实例。
- 缓存：用于存储和访问全局数据的缓存系统。
策略模式详解
实现方式
策略模式允许你定义一系列算法，并将每个算法封装成一个独立的策略对象。在 JavaScript 中，可以这样实现：
const strategies = {
add: function (a, b) {
return a + b;
},
subtract: function (a, b) {
return a - b;
},
multiply: function (a, b) {
return a * b;
},
};
function executeStrategy(strategy, a, b) {
if (strategies[strategy]) {
return strategies[strategy](a, b);
}
throw new Error('Invalid strategy');
}
const result1 = executeStrategy('add', 5, 3); // 结果为 8
const result2 = executeStrategy('multiply', 4, 6); // 结果为 24应用场景
策略模式适用于以下情况：
- 条件处理：当有多种条件下需要选择不同的处理方式时，使用策略模式能使代码更清晰。
- 表单验证：针对不同的输入字段，可以定义不同的验证策略。
- 排序算法：在对数据进行排序时，可以根据不同的策略（快速排序、冒泡排序等）选择不同的算法。
总结
单例模式用于确保只有一个实例存在，而策略模式用于在运行时选择算法。它们都是为了解决不同类型的问题而设计的模式，可以帮助提高代码的灵活性和可维护性。通过了解和应用这些模式，可以更好地组织和管理复杂的 JavaScript 应用程序。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。