设计模式

时间时 2024-11-27 来填补一下之前埋下的坑

工厂模式

工厂模式其实是较为常见的一种设计模式

//工厂模式，顾名思义就是创建出一个又一个的产品

const Xiaoming = {
  name: "XiaoMing",
  age: 18,
  career: "front-end developer",
};
//这显然可以一个一个创建但是人一旦多了，就不是很好管理了，于是我们就有了工厂模式的初始代码

function CreatePerson(name, age, career) {
  this.name = name;
  this.age = age;
  this.career = career;
}

const p1 = new CreatePerson("XiaoMing", 18, "front-end developer");
console.log(p1.name);
//这里的createPerson就是一个工厂函数，用来创建对象的函数，这样我们就可以通过这个函数来创建对象了
//这里还是使用了ES5的构造函数，我们可以使用ES6的class来实现

class Person {
  constructor(name, age, career) {
    this.name = name;
    this.age = age;
    this.career = career;
  }
}
const person1 = new Person("XiaoMing1", 18, "front-end developer1");
console.log(person1.name);

创建工厂函数的好处就是，以后每一次创建的时候都可以使用这个函数，只需要传参就可以了，但是上面的代码真的没有问题吗？

如果以后出现了一个需求，需要根据职业来创建一些特定的 work 函数，那么又要回到这个函数李进行修改，这样就会导致函数的不稳定，可以使用抽象工厂模式来解决这个问题

class CreateCompany {
  createName() {
    throw new Error(`不可以直接调用抽象工厂中的createName函数`);
  }
  createCareer() {
    throw new Error(`不可以直接调用抽象工厂中的createCareer函数`);
  }
}
//在这个抽象工厂中定义了两个函数

class createPersonInCompany extends CreateCompany {
  createName(...props) {
    return new createNamePerson(...props);
  }
  createCareer(career) {
    return new createCareerInCompany(career);
  }
}

class createNamePerson {
  constructor(...props) {
    //input array:string

    this.name = props[0][0].toString();
  }
}

class createCareerInCompany {
  constructor(career) {
    this.career = career;
  }
}

const personInCompany = new createPersonInCompany();
const name = personInCompany.createName(["XiaoMing1", "XiaoHong"]);
const career = personInCompany.createCareer("coder");
console.log(name.name);
console.log(career.career);

这里使用了抽象工厂模式，抽象工厂模式是工厂模式的升级版，抽象工厂模式是将工厂模式中的函数进行了抽象，这样就可以根据需求来创建不同的函数，如果以后需要修改，直接修改 createPersonInCompany 这个类就可以了。

抽象工厂和简单工厂目的都是去分离一个对象的创建和使用，简单工厂是将创建对象的函数封装到一个函数中，抽象工厂是将创建对象的函数进行了抽象，这样就可以根据需求来创建不同的函数。其实有这四个关键的点

抽象工厂
具体工厂
抽象产品
具体产品

单例模式

如何确保一个类有且仅有一个实例，并提供一个全局访问点

class SingleItem {
  show() {
    console.log("show");
  }
}
const s1 = new SingleItem();
const s2 = new SingleItem();
console.log(s1 === s2); //false

这个样子并不刻意产生一个实例，因为 new 可以产生多个实例，我们可以使用闭包来实现单例模式

const c1 = (function () {
  let instance = null;
  return function () {
    if (!instance) {
      instance = this;
    }
    return instance;
  };
})();

const s1 = new c1();
const s2 = new c1();
console.log(s1 === s2); //true

这里设计了一个闭包，因为闭包的特性，instance 只会被创建一次，所以这样就实现了单例模式

class Single {
  show() {
    console.log("Single实例");
  }
  static getInstance() {
    //如果没有实例那么就创建一个实例
    if (!Single.instance) {
      Single.instance = new Single();
    }
    //如果有就直接返回这一个实例
    return Single.instance;
  }
}
const s1 = Single.getInstance();
const s2 = Single.getInstance();
console.log(s1 === s2); //true

这是使用了静态方法来实现单例模式，这里的 static 是 ES6 的语法。

工厂模式​

单例模式​

工厂模式

单例模式