JavaScript高级:常见设计模式

设计模式是在软件开发中重复出现的问题的解决方案,它们是经过验证的、被广泛接受的最佳实践。设计模式可以让我们避免重复造轮子,提高代码质量和可维护性。在本文中,我们将介绍几种常见的设计模式,以及它们的实现和应用。

1. 单例模式

单例模式保证一个类只有一个实例,并提供全局访问点。在 JavaScript 中,可以通过闭包来实现单例模式。

javascript 复制代码
const Singleton = (function() {
  let instance;

  function createInstance() {
    // 创建实例的逻辑
    return {};
  }

  return {
    getInstance: function() {
      if (!instance) {
        instance = createInstance();
      }
      return instance;
    }
  };
})();

const instance1 = Singleton.getInstance();
const instance2 = Singleton.getInstance();
console.log(instance1 === instance2); // 输出:true

2. 工厂模式

工厂模式用于创建对象的方法,将对象的创建与使用分离,降低耦合度。在 JavaScript 中,可以通过构造函数或者简单工厂来实现工厂模式。

javascript 复制代码
class Product {
  constructor(name) {
    this.name = name;
  }
}

class ProductFactory {
  createProduct(name) {
    return new Product(name);
  }
}

const factory = new ProductFactory();
const product = factory.createProduct('A');

3. 观察者模式

观察者模式定义对象间的一种一对多依赖关系,当一个对象状态发生改变时,其依赖者都会收到通知并自动更新。在 JavaScript 中,可以使用发布-订阅模式来实现观察者模式。

javascript 复制代码
class Subject {
  constructor() {
    this.observers = [];
  }

  addObserver(observer) {
    this.observers.push(observer);
  }

  notify(message) {
    this.observers.forEach(observer => observer.update(message));
  }
}

class Observer {
  update(message) {
    console.log(`Received message: ${message}`);
  }
}

const subject = new Subject();
const observer1 = new Observer();
const observer2 = new Observer();

subject.addObserver(observer1);
subject.addObserver(observer2);

subject.notify('Hello, observers!');

4. 策略模式

策略模式定义一系列算法,并将其封装成策略类,使它们可以互相替换。在 JavaScript 中,可以使用对象字面量来实现策略模式。

javascript 复制代码
const discountStrategies = {
  normal: amount => amount,
  vip: amount => amount * 0.8,
  premium: amount => amount * 0.7
};

function calculateDiscount(strategy, amount) {
  return discountStrategies[strategy](amount);
}

const normalPrice = 100;
const vipPrice = calculateDiscount('vip', normalPrice);

5. 装饰者模式

装饰者模式动态地将责任附加到对象上,以扩展其功能。在 JavaScript 中,可以通过继承或组合来实现装饰者模式。

javascript 复制代码
class Coffee {
  cost() {
    return 10;
  }
}

class MilkDecorator {
  constructor(coffee) {
    this.coffee = coffee;
  }

  cost() {
    return this.coffee.cost() + 5;
  }
}

class SugarDecorator {
  constructor(coffee) {
    this.coffee = coffee;
  }

  cost() {
    return this.coffee.cost() + 2;
  }
}

let coffee = new Coffee();
coffee = new MilkDecorator(coffee);
coffee = new SugarDecorator(coffee);

console.log(coffee.cost()); // 输出:17

设计模式是开发者们多年实践的经验总结,它们可以帮助我们解决复杂的问题并提高代码的可维护性。单例模式、工厂模式、观察者模式、策略模式、装饰者模式等都是常见且实用的设计模式。通过理解这些模式的实现和应用,你将能够更好地构建优雅、可扩展的应用程序,提升你的编程艺术水平。无论你是初学者还是有经验的开发者,掌握设计模式,都将让你在编程的世界中更加游刃有余,创造出更加出色的作品!

相关推荐
玖玥拾1 天前
C/C++ 基础笔记(十一)类的进阶
c语言·c++·设计模式·
geovindu1 天前
go: Broadcast Pattern
开发语言·后端·设计模式·golang·广播模式
我爱cope1 天前
【Agent智能体23 | 规划-规划工作流】
人工智能·设计模式·语言模型·职场和发展
lengjingzju1 天前
符·形·音·意(SFEM):一种面向通用智能的四维认知架构
设计模式·ai·学习方法
贵慜_Derek1 天前
《从零实现 Agent 系统》连载 23|Skill 体系与 Skill Creator:能力打包与迭代
人工智能·设计模式·架构
张小姐的猫1 天前
【Linux】多线程 —— 线程池 | 单例模式 | 常见锁
linux·运维·服务器·c++·单例模式·设计模式·策略模式
老码观察1 天前
设计模式实战解读(十二):状态模式——干掉状态机里的 if-else 地狱
设计模式·状态模式
我爱cope1 天前
【Agent智能体24 | 规划-创建和执行LLM计划】
人工智能·设计模式·语言模型·职场和发展
Hillain1 天前
软件设计师设计模式
java·开发语言·经验分享·笔记·算法·设计模式·软考
zhengfei6112 天前
第3章 Agent 类型分类与设计模式
设计模式