开发者都应该了解的7种JavaScript设计模式

JavaScript 开发中常用的 7 种设计模式可分为创作型、结构型和行为型三类，它们为解决对象创建、组合和交互问题提供了可复用的方案。以下是具体模式及核心要点：

• 作用：通过构造函数初始化新对象，是 JavaScript 面向对象编程的基础。
• 特点：

  使用 new 关键字调用构造函数，分配内存并绑定 this。

  不支持继承（需结合原型链实现继承）。

• 示例：function ConstructorObject() { this.property = 'value';}const obj = new ConstructorObject();
• 适用场景：需要创建多个相似对象的场景（如用户、商品等）。

• 作用：基于原型继承，通过已有对象创建新对象，实现代码复用。
• 特点：

  原型对象作为蓝图，新对象共享其属性和方法。

  使用 Object.create() 实现原型继承。

• 示例：const myCar = { name: "Ford Escort", brake: function() { console.log("Stop!"); }};const yourCar = Object.create(myCar);console.log(yourCar.name); // "Ford Escort"
• 适用场景：需要共享方法或属性的对象（如车辆、动物等）。

• 作用：封装私有和公共成员，避免全局污染，支持信息隐藏。
• 特点：

  通过闭包实现私有变量和方法。

  返回包含公共接口的对象。

• 示例：function AnimalContainer() { const container = []; function addAnimal(name) { container.push(name); } return { add: addAnimal }; // 仅暴露公共方法}const container = AnimalContainer();container.add("Hen");
• 适用场景：需要管理私有状态的工具库或组件（如购物车、表单验证）。

• 作用：确保全局仅有一个实例，节省资源并统一管理状态。
• 特点：

  通过闭包或静态变量控制实例化。

  测试时依赖隐藏可能导致问题。

• 示例：function DatabaseConnection() { let instance = null; return { open: function() { if (!instance) instance = "Connected"; return instance; } };}const db = DatabaseConnection();db.open(); // "Connected"
• 适用场景：数据库连接、配置管理器等全局唯一实例需求。

• 作用：抽象对象创建过程，通过通用接口生成不同类型对象。
• 特点：

  解耦对象创建与使用代码。

  适合复杂初始化或动态类型选择。

• 示例：function DealerFactory(type, config) { const dealer = Object.create(type); Object.assign(dealer, config); return dealer;}const dealerA = DealerFactory({ title: () => "Dealer A" }, { id: 1 });
• 适用场景：需要灵活创建对象的场景（如 UI 组件、支付处理器）。

• 作用：定义对象间的一对多依赖，状态变化时自动通知订阅者。
• 特点：

  发布-订阅机制，解耦观察者与被观察者。

  避免频繁轮询检查状态。

• 示例：function Observer() { this.subscribers = [];}Observer.prototype.subscribe = function(fn) { this.subscribers.push(fn); };Observer.prototype.notify = function(data) { this.subscribers.forEach(fn => fn(data));};
• 适用场景：事件处理、状态管理（如 Redux、Vue 响应式系统）。

• 作用：将请求封装为对象，支持参数化、队列化和日志记录。
• 特点：

  命令对象包含 execute() 方法，统一调用接口。

  可撤销操作或动态切换执行者。

• 示例：const carManager = { buyVehicle: function(model) { return `Purchased ${model}`; }, executeCommand: function(command) { return command.execute(); }};const buyCommand = { execute: () => carManager.buyVehicle("Ford") };carManager.executeCommand(buyCommand);
• 适用场景：任务队列、远程过程调用（RPC）、撤销操作。

• 可维护性：通过标准化解决方案减少代码冗余。
• 可扩展性：模式提供灵活的架构，适应需求变化。
• 可测试性：明确职责分离简化单元测试（单例模式除外）。

开发者应根据具体问题选择模式，避免过度设计。例如，简单对象创建可直接用字面量或构造函数，而复杂状态管理适合观察者模式。理解模式本质而非机械套用，才能发挥其最大价值。