美文网首页深入解读JavaScript
JavaScript单例模式开发实践

JavaScript单例模式开发实践

作者: 悟C | 来源:发表于2018-09-12 23:08 被阅读0次

    单例模式的定义是:保证一个类仅有一个实例,并提供一个访问它的全局访问点。

    在开发实践中,我们可以用惰性单例技术,在合适的时候才创建对象,并且只创建唯一的一个。下面点击按钮弹出一个弹窗为例子,展示惰性单例模式:

      <div id="div1">点击</div>
      <script>
        var createModal = (function() {
          var div;
          return function() {
            if (!div) {
              div = document.createElement('div');
              div.innerHTML = '我是modal';
              div.style.display = 'none';
              document.body.appendChild(div);
            }
            return div;
          }
        })();
    
        document.getElementById('div1').onclick = function() {
          var modal = createModal();
          modal.style.display = 'block';
        }
      </script>
    

    通过闭包把第一次创建的div元素存在div变量里面,当用户再次去点击按钮的时候,就直接返回缓存的div。这就是一个惰性单例模式,保证了我是modal是唯一,避免了每次都去创建一个div。

    相关文章

      网友评论

        本文标题:JavaScript单例模式开发实践

        本文链接:https://www.haomeiwen.com/subject/hmqigftx.html