单例设计模式
单例设计模式特点是在整个程序运行过程中一个类型只有一个实例。
- 单例模式一
//代码实现
class Person{
constructor(){
if(!Person.instance){
Person.instance = this;
}
return Person.instance
}
}
let p1 = new Person();
let p2 = new Person();
console.log(p1 === p2); //true
- 单例模式二
class Person{
static getInstance(){
if(!Person.instance){
Person.instance = new Person();
}
return Person.instance
}
}
let p1 = Person.getInstance();
let p2 = Person.getInstance();
console.log(p1 === p2);
单例模式—模态框
class Model{
static getInstance(){
if(!Model.instance){
Model.instance = document.createElement('div');
Model.instance.innerHTML = '内容';
Model.instance.id = "model";
Model.instance.style.display = 'none';
document.body.appendChild(Model.instance);
}
return Model.instance
}
}
let open = document.querySelector('#open');
let close = document.querySelector('#close');
open.addEventListener('click',function(){
let model = Model.getInstance();
model.style.display = 'block';
})
close.addEventListener('click',function(){
let model = Model.getInstance();
model.style.display = 'none';
})