美文网首页
面试题2:实现Singleton模式

面试题2:实现Singleton模式

作者: IvyAutumn | 来源:发表于2018-12-28 19:35 被阅读0次

知识点:JS设计模式之单例模式
参考来源:
http://www.cnblogs.com/TomXu/archive/2012/02/20/2352817.html
https://blog.csdn.net/yisuowushinian/article/details/52003127

一、单例模式的概念

保证一个类仅有一个实例,并且提供一个访问它的全局访问点。

实现方法一般是先判断实例存在与否,如果存在直接返回,如果不存在就创建了再返回,这就确保了一个类只有一个实例对象。

单例模式典型的应用场景:单击按钮时,页面中会出现一个登陆浮窗,而该登录浮窗是唯一的,无论单击多少次按钮,这个浮窗都会被创建一次,则适合用单例模式创建。

二、单例模式的作用和注意事项

  • 模式作用:
    1、模块间通信
    2、系统中某个类的对象只能存在一个
    3、保护自己的属性和方法
  • 注意事项:
    1、注意this的使用
    2、闭包容易造成内存泄露,不需要的要赶快干掉
    3、注意new的成本。(继承)

三、单例模式的实现方法

  1. 使用命名空间
    最简单的方式是使用对象字面量
var Singleton = {
  prop1: "prop1"
  prop2: "prop2"
  method1: function () {
    console.log("I am a method.");
  }
}

2.使用闭包封装私有变量
这种方法把一些变量封装在闭包内部,只暴露一些接口跟外界通信

var user = (function(){
    var _name = 'sven',
        _age = 29;

    return{
        getUserInfo: function(){
            return _name + '-' + _age;
        }
    }
})();

用下划线来约定私有变量_name和_age,他们被封装在闭包产生的作用域中,外部是访问不到这两个变量的,这就避免了对全局的命令污染。

四、引入代理实现单例模式

var CreateDiv = function(html) {
    this.html = html;
    this.init();
};

CreateDiv.prototype.init = function() {
    var div = document.createElement('div');
    div.innerHTML = this.html;
    document.body.appendChild(div);
}

var ProxySingletonCreateDiv = (function() {
    var instance;
    return function(html) {
        if (!instance) {
            instance = new CreateDiv(html);
        }
        return instance;
    }
})();

var a = new ProxySingletonCreateDiv('seven1');
var b = new ProxySingletonCreateDiv('seven2');

引入代理实现单例模式的特点:
我们负责管理单例的逻辑移到了代理类ProxySingletonCreateDiv中。这样一来,CreateDiv就变成了一个普通的类,他跟ProxySingletonCreateDiv组合起来可以达到单例模式的效果。

五、惰性单例

惰性单例指的是在需要的时候才创建对象实例。惰性单例是单例模式的重点。

//获取单例
var getSingle = function(fn){
    var result;
    return function (){
        return result || (result=fn.apply(this,arguments));
    };
};

//创建div登录框
var createLoginLayer=function (){
    var div= document.createElement('div');
    div.innerHTML='我是登录框';
    document.body.appendChild(div);
    return div;
};

//创建iframe的dom节点
var createIframe=function(){
    //创建irame节点的代码
}

var createSingleLoginLayer = getSingle(createLoginLayer);
var createSingleIframe=getSingle(createIframe);

var loginLayer1 = createSingleLoginLayer();
var loginLayer2 = createSingleLoginLayer();

var iframe1=createSingleIframe();
var iframe2=createSingleIframe();

创建对象和管理单例的职责被分布在两个不同的方法中,这两个方法组合起来才具有单例模式的威力。

相关文章

网友评论

      本文标题:面试题2:实现Singleton模式

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