建造者模式
建造者模式(builder pattern)属于创建型模式的一种,提供一种创建复杂对象的方式。它将一个复杂的对
象的构建与它的表示分离,使得同样的构建过程可以创建不同的表示。
建造者模式是一步一步的创建一个复杂的对象,它允许用户只通过指定复杂的对象的类型和内容就可以构建
它们,用户不需要指定内部的具体构造细节。
js
class Navbar {
init() {
console.log('Navbar init')
}
getData() {
console.log('Navbar getData')
}
render() {
console.log('Navbar render')
}
}
class List {
init() {
console.log('List init')
}
getData() {
console.log('List getData')
}
render() {
console.log('List render')
}
}
class Creator {
startBuild(builder) {
builder.init()
builder.getData()
builder.render()
}
}
const creator = new Creator()
creator.startBuild(new Navbar())
creator.startBuild(new List())
建造者模式将一个复杂对象的构建层与其表示层相互分离,同样的构建过程可采用不同的表示。工厂模式主
要是为了创建对象实例或者类簇(抽象工厂),关心的是最终产出(创建)的是什么,而不关心创建的过程。而建造者模式关心的是创建这个对象的整个过程,甚至于创建对象的每一个细节。
单例模式
- 保证一个类仅有一个实例,并提供一个访问它的全局访问点
- 主要解决一个全局使用的类频繁地创建和销毁,占用内存
es5 写法:
js
function User(name, age) {
this.name = name;
this.age = age;
}
const Singleton = (function () {
let instance = null;
return function (name, age) {
if (!instance) {
instance = new User(name, age)
}
return instance;
}
})()
console.log(Singleton() === Singleton()) // true 单例模式 使用同一个实例 同一份地址 避免占用内存
es6 写法:
js
class Singleton {
constructor(name, age) {
if (!Singleton.instance) {
this.name = name;
this.age = age;
Singleton.instance = this;
}
return Singleton.instance;
}
}
console.log(new Singleton('张三', 18) === new Singleton('李四', 20)) // true
console.log(Singleton) // [class Singleton] { instance: Singleton { name: '张三', age: 18 } }
应用场景:
- 供全局使用的对话框
- Vuex、Pinia 全局状态管理