Javascript四种单体模式

最新推荐文章于 2019-09-29 11:18:30 发布

minihoop

最新推荐文章于 2019-09-29 11:18:30 发布

阅读量521

点赞数

CC 4.0 BY-SA版权

分类专栏： web前端 javascript 文章标签： Javascript单体模式

本文链接：https://blog.youkuaiyun.com/minihoop/article/details/51182376

web前端 javascript 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了单体模式的四种实现方式：简单单体、闭包单体、惰性单体及分支单体，并通过具体示例展示了如何使用JavaScript来实现这些模式。

<span style="font-size:18px;">/**
 * 单体模式
 * 划分命名空间
 */

/*
1 简单单体
 */
var singleton={
    name:"zhang",
    age:11,
    sayHello:function(){
        console.log(this.age);
    }
};</span>

<span style="font-size:18px;">/**
 *单体模式 2 闭包单体 保护数据 不受外界干扰
 */

var singlton=(function(){
    /**
     * 添加自己的私有成员
     */
    var x="qi";
    var sayBye=function(){
        console.log("bye");
    };

    /**
     * 把块级作用域中的执行结果赋值给对象
     */
    return {
        name:x,
        age:11,
        sayHello:function(){
            return sayBye();
        }
    };
}());
singlton.sayHello();</span>

<span style="font-size:18px;">/**
 * 3 惰性单体
 */
var singlton=(function(){

    /**
     * 私有变量用于控制返回的私有成员
     */
    var instance;
    /**
     * 建立初始化函数 添加自己的私有成员
     */

    function init(){
        var name="zhang";
        var age=11;
        return {
            name:name,
            age:age
        }
    }
    /**
     * 把块级作用域中的执行结果赋值给对象
     * 只有在调用getInstance方法时才会创建对象并返回
     * 最初的时候不会创建这个对象中具体的实例对象，性能更高
     *
     */
    return {
        getInstance:function(){
            if(!instance)
                instance=init();
            return instance;
        }
    };
}());
console.log(singlton.getInstance().age);</span>

<span style="font-size:18px;">/**
 * 4 分支单体 判断程序的分支 浏览器的差异检测
 */

var flag=false;
var singleton=(function(){
    var firefox={
        name:"firefox"
    };
    var chrome={
        name:"chrome"
    };
    return flag?firefox:chrome;

}());
console.log(singleton.name);</span>