资讯专栏INFORMATION COLUMN

单例模式实现模态框

alexnevsky / 485人阅读

摘要:第二次在调用的时候,由于已经存在了,所以直接返回,就不需要在了,这要就能确保是单例传统面向对象方式,每次点击都会弹出新的模态框创建藏着真话用单例改造在中通过变量的两种状态和闭包特性控制元素只能被添加一次

普通的构造函数加原型方式
function Singleton (uName){
         this.userName =uName
         this.ins = null
      }
      Singleton.prototype.showUserName = function(){
          return this.userName;
      }
      var obj1 = new Singleton("hi")
      var obj2 = new Singleton("hei")
      console.log(obj1==obj2) //false
      
      
      每次new都会在内存中生成一块新的内存区域保存新的实例,所以这种方式就不能保证只能new出一个单例,所以,我们想要创建一个单例,就要能够控制new创建实例的过程!!!,这就是单例的关键,那么要控制这个过程,肯定不能让用户直接调用构造函数,所以我们要另外想办法.
第一种办法: 在函数中添加一个静态方法,来控制创建实例的过程
   
    判断ins这个变量是否保存了一个实例,如果没有就new一个,否则直接返回。第二次在调用的时候,由于已经存在了ins,所以直接返回,就不需要在new了,这要就能确保是单例
传统面向对象方式,每次点击都会弹出新的模态框
    


    
    

用单例改造
   


    
    
    
在Module.info中通过变量isTure的两种状态和闭包特性控制元素只能被添加一次

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/106095.html

相关文章

  • 写一个单例构造的对话

    摘要:前言项目中,当需要用户处理事务,又不希望跳转页面以致打断工作流程时,我们会经常使用到对话框去承载相应的操作。虽然用得多,但是很多人其实并不知道怎么去写。饶有兴趣,自己尝试写了一个。 前言 项目中,当需要用户处理事务,又不希望跳转页面以致打断工作流程时,我们会经常使用到对话框去承载相应的操作。虽然用得多,但是很多人其实并不知道怎么去写。饶有兴趣,自己尝试写了一个。 API 参数 ...

    weknow619 评论0 收藏0
  • 使用合适的设计模式一步步优化前端代码

    摘要:修改配置远比修改源代码要简单的多。在年提出了种设计模式。常用的设计模式及设计原则可以参考下面的思维导图。每种设计模式都有它的适应场景,有的场景也会使用多种设计模式。包含文章视频源代码原创新书移动前端高效开发实战已在亚马逊京东当当开售。 作者:晓飞本文原创,转载请注明作者及出处 在后端语言中,设计模式应用的较为广泛。如Spring中常见的工厂模式、装饰者模式、单例模式、迭代器模式。但是...

    alin 评论0 收藏0
  • 记一段SPA的SEO历程:Html5 History Api 大显神通!

    摘要:用户体验的需求,完美地保留了瀑布流模态框的阅读模式。不支持的话,就不拦截瀑布流文块的,也就是直接让其跳转。 背景 想当年,我做了一个新媒体网站项目(AIISPO,已下线)。跟普通资讯网站不一样的是,老板要求PC端前台的文章阅读模式一定得是瀑布流+模态框。瀑布流指的是以瀑布流的形式将文章罗列出来,而模态框则指的是点击瀑布流中代表文章的某个文块时,直接在当前页面弹出模态框来显示文章正文。 ...

    Lyux 评论0 收藏0

发表评论

0条评论

alexnevsky

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<