js中的单例模式

Posted 2020-12-30 mrkaikai

1.场景：当我们需要多人合作完成一个项目，但是有一些操作是同样的操作时（例如：点击按钮显示加载的遮罩层；例如：提交表单时的验证都是一样的），这个时候我们就需要单例模式；

2.什么是单例模式：是一种常见的设计模式，在应用这个模式时，必须保证单利对象的类只有一个实例存在；这样全局拥有一个对象，有利于我们进行系统调整；

3.创建单例模式：

　　var singleton = {

　　　　name:‘zhaokaikai‘,

　　　　func (){
　　　　　　console.log(‘您执行了一个单例模式中的方法‘)

　　　　}

　　}

4.缺点：我们可以通过操作直接对象中的属性改变了原有的值

5.需求：如果我们想既可以扩展对象又可以继承对象中的属性与方法。

6.解决办法：var singleton = function () {

　　　　this.name = ‘zhaokaikai‘,

　　　　this.func = function(){

　　　　　　console.log(‘您执行了一个单例模式中的方法‘)

　　　　}

　　}

var first = new singleton();

7.缺点：如果空间中出现了一个相同的名字会造成覆盖。

8.解决办法：

（function(){

　　var nameSpace = nameSpace||{};

　　nameSpace.singleton = function(){　

　　　　this.name = ‘zhaokaikai‘,

　　　　this.func = function(){

　　　　　　console.log(‘您执行了一个单例模式中的方法‘)

　　　　}

　　}

　　if(window)

　　window.nameSpace = nameSpace||{}

}）（window,undefined）

 

9.网上看到的对于遮罩层的封装

var createMask = function(){

　　 var mask;

　　 return function(){

　　　　 return mask || ( mask = document.body.appendChild( document.createElement(‘div‘) ) )

　　　}

　 }()