探索JavaScript设计模式:实现方法一览

发表时间: 2023-02-18 03:23

JavaScript 作为一门灵活性很高的语言,可以用多种方式实现不同的设计模式。下面介绍几种常用的 JavaScript 设计模式及其实现方法。

1、单例模式

单例模式指的是在整个应用程序中,只有一个实例对象。实现单例模式的方法很多,下面是其中的一种:

const Singleton = (function() {  let instance;  function createInstance() {    const object = new Object({ name: 'mySingleton' });    return object;  }  return {    getInstance: function() {      if (!instance) {        instance = createInstance();      }      return instance;    }  };})();const instance1 = Singleton.getInstance();const instance2 = Singleton.getInstance();console.log(instance1 === instance2); // true

2、工厂模式

工厂模式指的是根据不同的参数创建不同的实例。下面是一个简单的工厂模式实现:

class Dog {  constructor(name) {    this.name = name;  }  bark() {    console.log('汪汪!');  }}class Cat {  constructor(name) {    this.name = name;  }  meow() {    console.log('喵喵!');  }}class AnimalFactory {  static createAnimal(type, name) {    if (type === 'dog') {      return new Dog(name);    } else if (type === 'cat') {      return new Cat(name);    }  }}const myDog = AnimalFactory.createAnimal('dog', '旺财');const myCat = AnimalFactory.createAnimal('cat', '咪咪');myDog.bark();myCat.meow();

3、观察者模式

观察者模式指的是对象间的一种一对多的依赖关系,当一个对象的状态发生改变时,所有依赖它的对象都会收到通知并自动更新。下面是一个简单的观察者模式实现:

class Subject {  constructor() {    this.observers = [];  }  addObserver(observer) {    this.observers.push(observer);  }  removeObserver(observer) {    const index = this.observers.indexOf(observer);    if (index > -1) {      this.observers.splice(index, 1);    }  }  notifyObservers() {    for (let observer of this.observers) {      observer.update();    }  }}class Observer {  constructor(subject) {    this.subject = subject;    this.subject.addObserver(this);  }  update() {    console.log('观察者收到通知!');  }}const mySubject = new Subject();const myObserver = new Observer(mySubject);mySubject.notifyObservers(); // 输出:观察者收到通知!

以上是三种常用的 JavaScript 设计模式及其实现方法,当然还有很多其他的设计模式,可以根据实际需求选择适合的设计模式进行实现。