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 常用代码技巧大收集
Feb 25 Javascript
jquery怎样实现ajax联动框(二)
Mar 08 Javascript
js复制网页内容并兼容各主流浏览器的代码
Dec 17 Javascript
javascript折半查找详解
Jan 26 Javascript
jQuery操作JSON的CRUD用法实例
Feb 25 Javascript
浅谈JavaScript中promise的使用
Jan 11 Javascript
import与export在node.js中的使用详解
Sep 28 Javascript
实例解析ES6 Proxy使用场景介绍
Jan 08 Javascript
Angularjs Promise实例详解
Mar 15 Javascript
Element Input组件分析小结
Oct 11 Javascript
javascript 构建模块化开发过程解析
Sep 11 Javascript
three.js 制作动态二维码的示例代码
Jul 31 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
提问的智慧(2)
2006/10/09 PHP
php 用checkbox一次性删除多条记录的方法
2010/02/23 PHP
php框架CodeIgniter主从数据库配置方法分析
2018/05/25 PHP
jquery浏览器滚动加载技术实现方案
2014/06/03 Javascript
jQuery下拉美化搜索表单效果代码分享
2015/08/25 Javascript
jquery遍历json对象集合详解
2016/05/18 Javascript
令按钮悬浮在(手机)页面底部的实现方法
2017/05/02 Javascript
vue-resource调用promise取数据方式详解
2017/07/21 Javascript
Vue+webpack项目基础配置教程
2018/02/12 Javascript
浅谈vue同一页面中拥有两个表单时,的验证问题
2018/09/18 Javascript
详解IOS微信上Vue单页面应用JSSDK签名失败解决方案
2018/11/14 Javascript
JavaScript数组去重的几种方法
2019/04/07 Javascript
基于layui实现高级搜索(筛选)功能
2019/07/26 Javascript
Vue 通过公共字段,拼接两个对象数组的实例
2019/11/07 Javascript
JS获取当前时间戳方法解析
2020/08/29 Javascript
python人人网登录应用实例
2014/09/26 Python
Python 3.x 连接数据库示例(pymysql 方式)
2017/01/19 Python
Scrapy的简单使用教程
2017/10/24 Python
python机器学习之神经网络(一)
2017/12/20 Python
python下解压缩zip文件并删除文件的实例
2018/04/24 Python
selenium python 实现基本自动化测试的示例代码
2019/02/25 Python
python面向对象法实现图书管理系统
2019/04/19 Python
Django基础知识 URL路由系统详解
2019/07/18 Python
Django使用Jinja2模板引擎的示例代码
2019/08/09 Python
python实现程序重启和系统重启方式
2020/04/16 Python
基于Python把网站域名解析成ip地址
2020/05/25 Python
THE OUTNET英国官网:国际设计师品牌折扣网站
2016/08/14 全球购物
美国畅销的跑步机品牌:ProForm
2017/02/06 全球购物
全球速卖通俄罗斯站:AliExpress俄罗斯
2019/06/17 全球购物
如何写出高性能的JSP和Servlet
2013/01/22 面试题
《绿色蝈蝈》教学反思
2014/03/02 职场文书
运输服务质量承诺书
2014/03/27 职场文书
实训报告范文大全
2014/11/04 职场文书
2015大学生暑期实习报告
2015/07/13 职场文书
宫崎骏十大动画电影,宫崎骏好看的动画电影排名
2022/03/22 日漫
JavaScript架构localStorage特殊场景下二次封装操作
2022/06/21 Javascript