javascript设计模式之模块模式学习笔记


Posted in Javascript onFebruary 15, 2017

我们通过单体模式理解了是以对象字面量的方式来创建单体模式的;比如如下的对象字面量的方式代码如下:

var singleMode = {
  name: value,
  method: function(){
        
  }
};

模块模式的思路是为单体模式添加私有变量和私有方法能够减少全局变量的使用;如下就是一个模块模式的代码结构:

var singleMode = (function(){
  // 创建私有变量
  var privateNum = 112;
  // 创建私有函数
  function privateFunc(){
    // 实现自己的业务逻辑代码
  }
  // 返回一个对象包含公有方法和属性
  return {
    publicMethod1: publicMethod1,
    publicMethod2: publicMethod1
  };
})();

模块模式使用了一个返回对象的匿名函数。在这个匿名函数内部,先定义了私有变量和函数,供内部函数使用,然后将一个对象字面量作为函数的值返回,返回的对象字面量中只包含可以公开的属性和方法。这样的话,可以提供外部使用该方法;由于该返回对象中的公有方法是在匿名函数内部定义的,因此它可以访问内部的私有变量和函数。

我们什么时候使用模块模式?

如果我们必须创建一个对象并以某些数据进行初始化,同时还要公开一些能够访问这些私有数据的方法,那么我们这个时候就可以使用模块模式了。

理解增强的模块模式

增强的模块模式的使用场合是:适合那些单列必须是某种类型的实例,同时还必须添加某些属性或方法对其加以增强的情况。比如如下代码:

function CustomType() {
  this.name = "tugenhua";
};
CustomType.prototype.getName = function(){
  return this.name;
}
var application = (function(){
  // 定义私有
  var privateA = "aa";
  // 定义私有函数
  function A(){};

  // 实例化一个对象后,返回该实例,然后为该实例增加一些公有属性和方法
  var object = new CustomType();

  // 添加公有属性
  object.A = "aa";
  // 添加公有方法
  object.B = function(){
    return privateA;
  }
  // 返回该对象
  return object;
})();

下面我们来打印下application该对象;如下:

console.log(application);

javascript设计模式之模块模式学习笔记

继续打印该公有属性和方法如下:

console.log(application.A);// aa
console.log(application.B()); // aa
console.log(application.name); // tugenhua
console.log(application.getName());// tugenhua

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript showModalDialog,open取得父窗口的方法
Mar 10 Javascript
在图片上显示左右箭头类似翻页的代码
Mar 04 Javascript
借助script进行Http跨域请求:JSONP实现原理及代码
Mar 19 Javascript
jquery提取元素里的纯文本不包含span等里的内容
Sep 30 Javascript
javascript搜索框点击文字消失失焦时文本出现
Sep 18 Javascript
浅谈jQuery中replace()方法
May 13 Javascript
详解javascript的变量与标识符
Jan 04 Javascript
JS跨域请求外部服务器的资源
Feb 06 Javascript
javascript 面向对象实战思想分享
Sep 07 Javascript
react-native封装插件swiper的使用方法
Mar 20 Javascript
Promise.all中对于reject的处理方法
Aug 01 Javascript
原生JS实现微信通讯录
Jun 18 Javascript
javascript设计模式之策略模式学习笔记
Feb 15 #Javascript
BootStrap实现带关闭按钮功能
Feb 15 #Javascript
Jil,高效的json序列化和反序列化库
Feb 15 #Javascript
Bootstrap模态框使用详解
Feb 15 #Javascript
js时间戳和c#时间戳互转方法(推荐)
Feb 15 #Javascript
浅析javaScript中的浅拷贝和深拷贝
Feb 15 #Javascript
微信小程序之MaterialDesign--input组件详解
Feb 15 #Javascript
You might like
一段php加密解密的代码
2006/10/09 PHP
PHP脚本数据库功能详解(中)
2006/10/09 PHP
php数组函数序列之array_search()- 按元素值返回键名
2011/11/04 PHP
调整PHP的性能
2013/10/30 PHP
php创建sprite
2014/02/11 PHP
微信公众号支付之坑:调用支付jsapi缺少参数 timeStamp等错误解决方法
2016/01/12 PHP
PHP实现的无限分类类库定义与用法示例【基于thinkPHP】
2018/08/06 PHP
jQuery 白痴级入门教程
2009/11/11 Javascript
jquery 插件实现瀑布流图片展示实例
2015/04/03 Javascript
用js读写cookie的简单方法(推荐)
2016/08/08 Javascript
js实现一个简单的数字时钟效果
2017/03/29 Javascript
JS获取动态添加元素的方法详解
2019/07/31 Javascript
JS实现拼图游戏
2021/01/29 Javascript
Node.js API详解之 timer模块用法实例分析
2020/05/07 Javascript
vue-router 2.0 跳转之router.push()用法说明
2020/08/12 Javascript
解决在Vue中使用axios POST请求变成OPTIONS的问题
2020/08/14 Javascript
鸿蒙系统中的 JS 开发框架
2020/09/18 Javascript
[01:16:37]【全国守擂赛】第三周决赛 Dark Knight vs. 一个弱队
2020/05/04 DOTA
零基础写python爬虫之urllib2中的两个重要概念:Openers和Handlers
2014/11/05 Python
Python易忽视知识点小结
2015/05/25 Python
对Python subprocess.Popen子进程管道阻塞详解
2018/10/29 Python
使用Django2快速开发Web项目的详细步骤
2019/01/06 Python
Python求均值,方差,标准差的实例
2019/06/29 Python
简单介绍python封装的基本知识
2019/08/10 Python
Django 实现对已存在的model进行更改
2020/03/28 Python
Python实现读取并写入Excel文件过程解析
2020/05/27 Python
css sprite简单实例
2016/05/23 HTML / CSS
图解CSS3制作圆环形进度条的实例教程
2016/05/26 HTML / CSS
Javascript 高级手势使用介绍
2013/04/21 HTML / CSS
英国领先的电视购物零售商:Ideal World
2019/03/18 全球购物
大专学生推荐信范文
2013/11/19 职场文书
园林施工员岗位职责
2013/12/11 职场文书
个人自荐书
2013/12/20 职场文书
汽车维修专业个人求职信范文
2014/01/01 职场文书
知识竞赛活动方案
2014/02/18 职场文书
说好普通话圆梦你我他演讲稿
2014/09/21 职场文书