javascript 设计模式之单例模式

单例模式是一种简单而很是实用的模式特别是惰性单例技术,下面例子贴出了单列模式的代码设计模式

<button id="loginBtn">登陆</button>
    <script>
      // 通用单例模式
      let getSingle = function(fn) {
        let result;
        return function() {
          return result || (result = fn.apply(this, arguments));
        };
      };

      let createLoginLayer = function() {
        let div = document.createElement("div");
        div.innerHTML = "我是登录浮窗";
        div.style.display = "none";
        return div;
      };

      let createSingleLoginLayer = getSingle(createLoginLayer);

      document.getElementById("loginBtn").onclick = function() {
        let loginLayer = createSingleLoginLayer();
        loginLayer.style = "block";
      };

      // 建立惟一的 iframe

      let createSingIframe = getSingle(function() {
        let iframe = document.createElement("iframe");
        document.body.appendChild(iframe);
        return iframe;
      });

      document.getElementById("loginBtn").onclick = function() {
        let loginLayer = createSingIframe();
        loginLayer.src = "http://baidu.com";
      };
复制代码

在这个例子中,咱们把建立实例对象的职责和管理单例的职责分别放置在两个方法中,这两个方法能够独立的变化而相互不影响。 当它们链接在一块儿的时候, 就完成了建立惟一实例对象的功能。bash

该资料来源曾探著的《设计模式与开发实践》app

相关文章
相关标签/搜索