常见的JavaScript设计模式（一）

一、模块模式(Module Pattern)

用于将代码封装为具有特定功能的独立模块。

const myModule=(function () {
  let privateVarible="This is private";
  function privateMethod() {
    console.log(privateVarible);
  }
  return {
    publicMethod(){
      privateMethod();
    },
  };
})();

二、单例模式（SingIeton Pattern）

确保一个类只有一个实例，并提供全局访问点来访问该实例。

const singleton = (function () {
  let instance;
  function creatInstance() {
    return {
      name: 'Singleton Instance',
    };
  }
  return {
    getInstance() {
      if (!instance) {
        instance = creatInstance();
      }
      return instance;
    },
  };
})();

const instance1 = singleton.getInstance();
const instance2 = singleton.getInstance();
console.log(instance1 === instance2);

三、工厂模式（Factory Pattern）

提供了一种封装对象创建过程的方式，使得客户端代码与具体对象的创建逻辑解耦。

function createUser(name,role) {
  return {
    name,
    role,
    sayHello(){
      console.log(`name is ${this.name} and I am a ${this.role}`);
    }
  }
}

const admain = createUser("Alice","admain");
admain.sayHello();

四、观察者模式（Observer Pattern）

观察者模式是一种对象间的对多的依赖关系，当一个对象的状态发生变化时，它的所有依赖对象都会收到通知并自动更新。

function Subject() {
  this.observers = [];
}
Subject.prototype = {
  // 订阅
  subscribe(observer) {
    this.observers.push(observer);
  },
  // 取消订阅
  unsubscribe(observer) {
    this.observers = this.observers.filter((obs) => objs !== observer);
  },
  // 通知
  notify(data) {
    this.observers.forEach((observer) => observer.update(data));
  },
};
// 观察者
function Observer(name) {
  this.name = name;
}
Observer.prototype.update = function (data) {
  console.log(`${this.name} received data: ${data}`);
};

const subject = new Subject();
const observer1 = new Observer('observer1');
const observer2 = new Observer('observer2');
subject.subscribe(observer1);
subject.subscribe(observer2);
subject.notify('New data availabel');