1.实例解释模块模式

简明扼要的说,经典的模块模式指的定义一个立即执行的匿名函数。在函数中定义私有函数和私有变量并且返回一个包含公共变量和公共函数作为属性和方法的匿名对象。

  1. var classicModulePattern = function(){
  2. var privateVar = 1;
  3. function privateFunction(){
  4. alert('private');
  5. }
  6. return {
  7. publicVar:2,
  8. publicFunction:function(){
  9. classicModulePattern.anotherPublicFunction();
  10. },
  11. anotherPublicFunction:function(){
  12. privateFunction();
  13. }
  14. }
  15. }();
  16. classicModulePattern.publicFunction();

这种形式也经常令人抱怨,因为每当需要在一个公共方法调用另一个公共方法或者获取公共变量,就需要重复主对象的名字。另外一个比较苦恼的原因是你不得不把返回的公共函数或变量写成对象字面量的形式。

为了解决重复写主对象名字的问题,可以定义一个命名为“pub”的对象,在其上添加公共方法和公共属性,然后return这个对象。

  1. var namedObjectModulePattern = function(){
  2. var pub = {};
  3. var privateVar = 1;
  4. function privateFunction(){
  5. alert('private');
  6. };
  7. pub.publicVar = 2;
  8. pub.publicFunction = function(){
  9. pub.anotherPublicFunction();
  10. };
  11. pub.anotherPublicFunction = function(){
  12. privateFunction();
  13. };
  14. return pub;
  15. }();
  16. namedObjectModulePattern.publicFunction();

但是,添加一个pub对象看起来有些冗余,可以采用另一种方法,在私有作用域中定义所有的函数和变量,然后在模块末尾返回一个匿名对象,可以在其中指向某些私有变量和函数作为公共变量和函数。

  1. var revealingModulePattern = function(){
  2. var privateVar = 1;
  3. function privateFunction(){
  4. alert('private');
  5. };
  6. var publicVar = 2;
  7. function publicFunction(){
  8. anotherPublicFunction();
  9. };
  10. function anotherPublicFunction(){
  11. privateFunction();
  12. };
  13. // reveal all things private by assigning public pointers
  14. return {
  15. publicFunction:publicFunction,
  16. publicVar:publicVar,
  17. anotherPublicFunction:anotherPublicFunction
  18. }
  19. }();
  20. revealingModulePattern.publicFunction();

这样保持了整个脚本连续性并且使哪些函数和变量是公共的看起来一目了然。另一个好处是你能用你想要的命名来展示这些私有函数,增强了可读性。

  1. var revealingModulePattern = function(){
  2. var privateVar = 1;
  3. function privateFunction(){
  4. alert('private');
  5. };
  6. var publicVar = 2;
  7. function publicFunction(){
  8. anotherPublicFunction();
  9. };
  10. function anotherPublicFunction(){
  11. privateFunction();
  12. };
  13. // reveal all things private by assigning public pointers
  14. return {
  15. init:publicFunction,
  16. count:publicVar,
  17. increase:anotherPublicFunction
  18. }
  19. }();
  20. revealingModulePattern.init();

你甚至可以在匿名对象中调用函数返回一个值作为公共属性。

  1. var revealingModulePattern = function(){
  2. var privateVar = 1;
  3. function privateFunction(){
  4. alert('private');
  5. };
  6. var publicVar = 2;
  7. function publicFunction(){
  8. anotherPublicFunction();
  9. };
  10. function anotherPublicFunction(){
  11. privateFunction();
  12. };
  13. function getCurrentState(){
  14. return 2;
  15. };
  16. // reveal all things private by assigning public pointers
  17. return {
  18. init:publicFunction,
  19. count:publicVar,
  20. increase:anotherPublicFunction,
  21. current:getCurrentState()
  22. }
  23. }();
  24. alert(revealingModulePattern.current)
  25. // => 2
  26. revealingModulePattern.init();

2.参考资料

实例参考博客

stackoverflow命名空间

[Js代码风格]浅析模块模式的更多相关文章

  1. 大神的JS代码风格指南

    js代码风格指南:1.缩进使用空格,不要用制表符2.必须用分号3.暂时不用ES6(modules)例如export和import命令4.不鼓励(不禁止)水平对齐5.少用var 都应该使用const或者 ...

  2. JS代码风格自动规整工具Prettier

    问题背景 通常使用 ESLint做代码风格检查检查, 和部分代码质量检查. 但是使用ESLint在入库时候, 会产生很多的代码修正工作, 需要开发者一个一个的修改. 如果很多,并且时间紧迫,甚是尴尬. ...

  3. Google HTML/CSS/JS代码风格指南

    JS版本参见:http://www.zhangxinxu.com/wordpress/2012/07/google-html-css-javascript-style-guides/ HTML/CSS ...

  4. js精要之模块模式

    // 模块模式是一种用于创建拥有私有数据的单件对象的模式,基本做法是使用立调函数(IIFE)来返回一个对象 var yourObjet = (function(){ // 私有数据 return { ...

  5. JS代码风格指南

    一.基本格式 缩进 建议每级4个空格,可以给编辑器设置tab = 4个空格,自动转换 分号 不要省略分号,防止ASI(自动插入分号)错误 行宽 每行代码不超过80个字符,过长应该用操作符手动断行 断行 ...

  6. js 代码风格(2)

    Properties    • 当访问属性的时候,我们使用点(.)操作符. var luke = { jedi: true, age: 28 }; // bad var isJedi = luke[' ...

  7. highlight.js代码风格引入方法

    <link href="https://cdn.bootcss.com/highlight.js/9.15.10/styles/darcula.min.css" rel=&q ...

  8. js代码风格之链式结构

    <div class="box"> <ul class="menu"> <li class="level1"& ...

  9. Django之代码风格

    1 代码风格 稍微关注一下下面这些代码标准风格指导规则将会对你大有益处,我们高度建议你通读词章,即便你此时可能正想跳过它. 1.1 让你的代码保持可读性的重要性 代码在读方面的重要性胜过写.一个代码块 ...

随机推荐

  1. Sass函数:值列表函数length

    length() 函数主要用来返回一个列表中有几个值,简单点说就是返回列表清单中有多少个值: >> length(10px) 1 >> length(10px 20px (bo ...

  2. mac文本操作小技巧——2019年10月17日

    声明:看的别人博主写的,自己整理的,非原创,只是自用. mac文本操作技巧 官方指导文档:https://support.apple.com/zh-cn/HT201236 1.光标移动 1.1 行首. ...

  3. Autodesk Maya 2019 for Mac(三维动画软件)最新功能介绍

    Autodesk Maya是美国Autodesk公司出品的世界顶级的三维动画软件,应用对象是专业的影视广告,角色动画,电影特技等.Maya功能完善,工作灵活,易学易用,制作效率极高,渲染真实感极强,是 ...

  4. 远程桌面连接,运维工程师-必备软件【MultiDesk】

    实习时,在本地一家大型女装公司做桌面运维,服务器碰得到少,大部分时间都是在维护同事的电脑桌面,什么360全家桶了,毒霸了,都是通过远程工具 teamviewer 去搞定的. 后来做了前端开发,免不了自 ...

  5. firewall&iptables

    一.firewall 查看firewall状态 firewall-cmd --state 如果firewall为关闭状态,先启动firewall systemctl start firewalld 添 ...

  6. 4412 Linux设备总线

    总线_设备_驱动注册流程详解 注册流程图 • 设备一般都需要先注册,才能注册驱动– 现在越来越多的热拔插设备,反过来了.先注册驱动,设备来了再注册 设备 • 本节使用的命令– 查看总线的命令#ls / ...

  7. 跨域共享cookie

    1. JSP中Cookie的读写 Cookie的本质是一个键值对,当浏览器访问web服务器的时候写入在客户端机器上,里面记录一些信息.Cookie还有一些附加信息,比如域名.有效时间.注释等等. 下面 ...

  8. Linux操作系统之安全审计功能

    内核编译时,一般打开NET选项就打开AUDIT选项了.在系统中查看audit是否打开,root 用户执行:service auditd status 我们知道在Linux系统中有大量的日志文件可以用于 ...

  9. vue项目打包之后原本好的样式变得不好了的原因分析

    这个主要是打包的过程将所有的css文件进行归类压缩,导致原先其他文件里的样式对当前的产生了影响,应该有同样的类名了.怎么改?要么改类名,要么用scope,scss的写法.

  10. AGC013 E Placing Squares——模型转化+矩阵乘法

    题目:https://atcoder.jp/contests/agc013/tasks/agc013_e 边长的平方,可以看做是在该范围内放两个不同的球的方案数.两个球可以重合. 题意变成:给长为 n ...