JavaScript设计模式之单例模式简单实例教程


Posted in Javascript onJuly 02, 2018

本文实例讲述了JavaScript设计模式之单例模式。分享给大家供大家参考,具体如下:

一、单例模式概念

单例就是保证一个类只有一个实例,实现方法一般是先判断实例存在与否,如果存在直接返回,如果不存在就创建了再返回,这就确保了一个类只有一个实例对象。在JavaScript里,单例作为一个命名空间提供者,从全局命名空间里提供一个唯一的访问点来访问该对象。

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

模式作用:

1、模块间通信

2、系统中某个类的对象只能存在一个

3、保护自己的属性和方法

注意事项:

1、注意this的使用

2、闭包容易造成内存泄露,不需要的要赶快干掉

3、注意new的成本。(继承)

三、单例模式代码和实战总结

<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <title>单例模式</title>
</head>
<body>
<!--<script>
  var Singleton = (function(){
    var instantiated;
    function init(){
      /*这里定义单例代码*/
      return{
        publicMethod:function(){
          console.log("hello world");
        },
        publicProperty:"test"
      };
    }
    return{
      getInstance:function(){
        if(!instantiated){
          instantiated = init();
        }
        return instantiated;
      }
    }
  })();
  Singleton.getInstance().publicMethod();
</script>-->
<script>
   /*1.独立的对象 建2个一个xiaowang一个xiaoli
   2.让xiaoli跟xiaowang通过门铃进行通信
   3.先看一下xiaowang家有没有门 如果油门直接通过门铃通讯didi如果没有门先建门
   4.两个单例之间看是通讯*/
  var xiaowang = (function(argument){
    var men;
    var xiaowangjia = function(msg){
      this.menling = msg;
    }
    var info = {
      sendMessage:function(msg){
        if(!men){
          men = new xiaowangjia(msg);
        }
        return men;
      },
      abc:function(){
        return 123;
      }
    };
    return info;
  })();
  var xiaoli = {
    callXiaowang:function(msg){
      var _xw = xiaowang.sendMessage(msg);
      alert(_xw.menling);
      console.log(_xw.menling);
      _xw = null;//等待垃圾回收
      var abc = xiaowang.abc();
      console.log(abc);
    }
  }
  xiaoli.callXiaowang("didi");
</script>
</body>
</html>

使用在线HTML/CSS/JavaScript代码运行工具 http://tools.3water.com/code/HtmlJsRun测试运行效果如下:

JavaScript设计模式之单例模式简单实例教程

JavaScript设计模式之单例模式简单实例教程

更多关于JavaScript相关内容可查看本站专题:《javascript面向对象入门教程》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
把jquery 的dialog和ztree结合实现步骤
Aug 02 Javascript
jQuery探测位置的提示弹窗(toolTip box)详细解析
Nov 14 Javascript
js阻止事件追加的具体实现
Oct 15 Javascript
node.js中的fs.fchown方法使用说明
Dec 16 Javascript
使用JavaScript链式编程实现模拟Jquery函数
Dec 21 Javascript
js计算文本框输入的字符数
Oct 23 Javascript
jQuery实现边框动态效果的实例代码
Sep 23 Javascript
JavaScript中全选、全不选、反选、无刷新删除、批量删除、即点即改入库(在yii框架中操作)的代码分享
Nov 01 Javascript
js实现弹窗暗层效果
Jan 16 Javascript
如何选择jQuery版本 1.x? 2.x? 3.x?
Apr 01 jQuery
Node.js 如何利用异步提升任务处理速度
Jan 07 Javascript
js实现移动端轮播图滑动切换
Dec 21 Javascript
JavaScript设计模式之建造者模式实例教程
Jul 02 #Javascript
JS实现的JSON序列化操作简单示例
Jul 02 #Javascript
JS内部事件机制之单线程原理
Jul 02 #Javascript
JS将网址url转化为JSON格式的方法
Jul 02 #Javascript
原生JS实现列表子元素顺序反转的方法分析
Jul 02 #Javascript
JS限制输入框输入的实现代码
Jul 02 #Javascript
webpack手动配置React开发环境的步骤
Jul 02 #Javascript
You might like
PHP将HTML转换成文本的实现代码
2015/01/21 PHP
学习php设计模式 php实现装饰器模式(decorator)
2015/12/07 PHP
Laravel框架在本地虚拟机快速安装的方法详解
2018/06/11 PHP
PHP静态方法和静态属性及常量属性的区别与介绍
2019/03/22 PHP
javascript实现仿银行密码输入框效果的代码
2007/12/13 Javascript
jquery ready函数源代码研究
2009/12/06 Javascript
用JS写的一个TableView控件代码
2010/01/23 Javascript
从数据结构分析看:用for each...in 比 for...in 要快些
2013/04/17 Javascript
jquery 页面滚动到指定DIV实现代码
2013/09/25 Javascript
jquery制作弹窗提示窗口代码分享
2014/03/02 Javascript
JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
2014/06/23 Javascript
Extjs grid panel自带滚动条失效的解决方法
2014/09/11 Javascript
JavaScript获取鼠标移动时的坐标(兼容IE8、chome谷歌、Firefox)
2014/09/13 Javascript
jQuery中toggleClass()方法用法实例
2015/01/05 Javascript
js微信支付实现代码
2016/12/22 Javascript
jQuery实现圣诞节礼物动画案例解析
2016/12/25 Javascript
JavaScript获取select中text值的方法
2017/02/13 Javascript
详解vue-cli快速构建项目以及引入bootstrap、jq
2017/05/26 Javascript
javascript代码优化的8点总结
2018/01/29 Javascript
vue实现动态显示与隐藏底部导航的方法分析
2019/02/11 Javascript
基于JavaScript实现单例模式
2019/10/30 Javascript
JS面向对象编程实现的Tab选项卡案例详解
2020/03/03 Javascript
[11:57]《一刀刀一天》第十七期:TI中国军团加油!
2014/05/26 DOTA
Python中struct模块对字节流/二进制流的操作教程
2017/01/21 Python
Python 专题二 条件语句和循环语句的基础知识
2017/03/19 Python
Python中用post、get方式提交数据的方法示例
2017/09/22 Python
Django框架orM与自定义SQL语句混合事务控制操作
2019/06/27 Python
怎样写演讲稿
2014/01/04 职场文书
司法建议书范文
2014/05/13 职场文书
求职信标题怎么写
2014/05/26 职场文书
感恩祖国演讲稿
2014/09/09 职场文书
2015年上半年信访工作总结
2015/03/30 职场文书
redis配置文件中常用配置详解
2021/04/14 Redis
Python绘制地图神器folium的新人入门指南
2021/05/23 Python
「月刊Action」2022年5月号封面公开
2022/03/21 日漫
Python Django / Flask如何使用Elasticsearch
2022/04/19 Python