设计模式--------单例模式

时间：2020-07-29 14:53:11 阅读：57 评论：0 收藏：0 [点我收藏+]

标签：场景 click har init 模式 result script idt log

1.单例模式的定义：保证?个类仅有?个实例，并提供?个访问它的全局访问点。实现的?法为先判断实例存在与否，如果存在则直接返回，如果不存在就创建了再返回，这就确保了?个类只有?个实例对象。

适?场景：?个单?对象。?如：弹窗，?论点击多少次，弹窗只应该被创建?次‘ 实现起来也很简单，??个变量缓存即可

<!DOCTYPE html>

<head>

<title>Document</title>

<style>

.model{

border:1px solid black;

position: fixed;

width:300px;

height:300px;

top:20%;

left:50%;

margin-left:-150px;

text-align: center;

}

</style>

</head>

<body>

var getSingle = function( fn ){

var result;

return function(){

return result || ( result = fn .apply(this, arguments ) );

}

};

var createLoginLayer = function(){

var div = document.createElement( ‘div‘ );

div.innerHTML = ‘我是登录浮窗‘;

div.className = ‘model‘

div.style.display = ‘none‘;

document.body.appendChild( div );

return div;

};

var createSingleLoginLayer = getSingle( createLoginLayer );

document.getElementById( ‘loginBtn‘ ).onclick = function(){

var loginLayer = createSingleLoginLayer();

loginLayer.style.display = ‘block‘;

};

</script>

</body>

</html>

应?场景

我们再element中的弹窗代码中，可以看到单例模式的实际案例保证全局唯?性 https://github.com/El

emeFE/element/blob/dev/packages/message-box/src/main.js#L79

设计模式--------单例模式

标签：场景 click har init 模式 result script idt log

原文地址：https://www.cnblogs.com/zhouyideboke/p/13396084.html

踩

(0)

评论一句话评论（0）

分享档案

更多>

2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)

周排行