js之单例模式惰性加载技术

!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>单例模式之惰性加载技术</title>
</head>
<body>
    <button id="loginBtn">登录</button>

<script type="text/javascript">
    // 负责实现单例
    var getSingle = function ( fn ) {
        var result;
        return function () {
            return result || (result = fn.apply( this, arguments));
        }
    };
    //  创建实例元素的方法
    var loginLayer = function(){
        var div = document.createElement( 'div');
        div.innerHTML = '好好学习,天天向上';
        document.body.appendChild( div );
        return div;
    };
     // 连接实例的生成
    var loginDiv = getSingle(loginLayer);

    document.querySelector( '#loginBtn').onclick = function () {
      // 当按钮点击时,才生成实例,且仅生成一个实例。
        var login = loginDiv();
    };
</script>
</body>

</html>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

友情链接更多精彩内容