设计模式---单例模式总结

 单例设计模式

 定义：保证一个类只有一个实例，并提供一个全局的访问点

应用实例 登录，用闭包作为缓存，判断当前的类是否存在，如果存在，就不会再重新创建，防止了再次创建，优化性能

var createLoginDialog = (function () {

var div;

return function () {

if (!div) {

div = document.createElement('div');

div.innerHTML = '登录悬浮框';

var closeBtn = document.createElement('button');

closeBtn.innerHTML = 'X';

div.appendChild(closeBtn);

closeBtn.onclick = function () {

div.style.display = 'none';

}

document.body.appendChild(div);

} else {

div.style.display = 'block';

}

return div;

}

})();

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

var loginDiv = createLoginDialog();

}

 为了满足单例模式具有单一职原则 ，抽离出一个单例方法

var createLoginDialog = function () {

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

div.innerHTML = '登录悬浮框';

var closeBtn = document.createElement('button');

closeBtn.innerHTML = 'X';

div.appendChild(closeBtn);

closeBtn.onclick = function () {

div.style.display = 'none';

}

document.body.appendChild(div);

return div;

}

var getSingleton = function (fn) {

var result;

return function () {

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

}

}

var createSingletonLogin = getSingleton(createLoginDialog);

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

var loginDiv = createSingletonLogin();

loginDiv.style.display = 'block';

}