传送门

http://www.ruanyifeng.com/blog/2012/10/javascript_module.html

1. 原始写法

function f1() {
// do sth..
} function f2() {
// do sth..
}

缺点:污染全局变量;可能和其他模块发生冲突;模块中的成员之间看不出关系。

2. 把模块写进去进对象里面

var module1 = new Object({
_count : 0, f1 : function() {
//..
}, f2 : function() {
//... }
});

缺点:改变了模块内部状态;例如module1._count = 5。不符合“开闭原则”。

3. 改进第2: 用立即执行函数(立即执行沙盒)来写

沙盒即是隔离的环境。在JS就是(function(){})。

立即执行函数(IIFE, Immediately-Invoked Function Expression)就是沙盒()。

var module1 = (function() {
var _count = 0;
var f1 = function() {
//..
}; var f2 = function() {
//..
}; return {
f1 : f1,
f2 : f2
};
})();

4. 放大模式(augmentation), 宽放大模(Losse augmentation),输入全部变量等看阮老师的文章(传送门)。

JavaScirpt - 模块的写法的更多相关文章

  1. Javascript模块化编程(一):模块的写法

    Javascript模块化编程(一):模块的写法 作者: 阮一峰 原文链接:http://www.ruanyifeng.com/blog/2012/10/javascript_module.html ...

  2. Javascript模块化编程:模块的写法

    声明:本文转载自:阮一峰的网络日志,原文地址http://www.ruanyifeng.com/blog/2012/10/javascript_module.html,http://www.ruany ...

  3. AMD、CMD、UMD 模块的写法

    简介 最近几年,我们可以选择的Javascript组件的生态系统一直在稳步增长.虽然陡增的选择范围是极好的,但当组件混合匹配使用时就会出现很尴尬的局面.开发新手们会很快发现不是所有组件都能彼此“和平相 ...

  4. 【02】AMD、CMD、UMD 模块的写法

    AMD.CMD.UMD 模块的写法 简介 最近几年,我们可以选择的Javascript组件的生态系统一直在稳步增长.虽然陡增的选择范围是极好的,但当组件混合匹配使用时就会出现很尴尬的局面.开发新手们会 ...

  5. Javascript模块化编程(一):模块的写法 (转)

    Javascript模块化编程(一):模块的写法 原文作者: 阮一峰 日期: 2012年10月26日 随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞 ...

  6. Javascript模块化编程(一):模块的写法(转)

    随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂. 网页越来越像桌面程序,需要一个团队分工协作.进度管理.单元测试等等......开发者 ...

  7. Javascript模块化编程(一):模块的写法 作者: 阮一峰

    声明:转载自阮一峰的网络日志 随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂. 网页越来越像桌面程序,需要一个团队分工协作.进度管理. ...

  8. Javascript模块化编程(一):模块的写法 (转载 学习中。。。。)

    转载地址:http://www.ruanyifeng.com/blog/2012/10/javascript_module.html 阮一峰 大神:http://www.ruanyifeng.com/ ...

  9. Javascript模块化编程(一):模块的写法【转】

    作者: 阮一峰 日期: 2012年10月26日 随着网站逐渐变成"互联网应用程序",嵌入网页的Javascript代码越来越庞大,越来越复杂. 网页越来越像桌面程序,需要一个团队分 ...

随机推荐

  1. webpack 打包CSS 引入图片

    加载css 安装style-loader, css-loader npm install style-loader css-loader --save-dev 配置webpack.config.js文 ...

  2. mvc 模板位置

    mvc4 模板位置 Common7\IDE\ItemTemplates\CSharp\Web\MVC 4\CodeTemplates mvc5 模板位置 Common7\IDE\Extensions\ ...

  3. python操作mongo实例

    # coding:utf-8 """ mongo操作工具 """ from pymongo import MongoClient MONGO ...

  4. kuangbin专题 专题九 连通图 HDU 4738 Caocao's Bridges

    题目链接:https://vjudge.net/problem/HDU-4738 题目:tarjan求桥,坑点: 题目说是分岛任务...如果所有岛之间没有完全连通,就不需要执行任务了...答案直接是0 ...

  5. c++primer练习题

    2.7 输出地址和姓名(1 #include <iostream> using namespace std; int main() { int 距离; cout << &quo ...

  6. vue 文件插件 Vetur 设置说明官网

    vue 文件插件 Vetur 设置说明官网 https://vuejs.github.io/vetur/formatting.html#settings

  7. 题解【洛谷P2863】 [USACO06JAN]牛的舞会The Cow Prom

    题面 题解 \(Tarjan\)板子题. 统计出大小大于\(1\)的强连通分量数量输出即可. 代码 #include <iostream> #include <cstdio> ...

  8. node 崩 处理

    node_modules->bin webpack-dev-server.cmd @IF EXIST "%~dp0\node.exe" ( "%~dp0\node. ...

  9. 2019牛客多校第四场J free 最短路

    free 题意 给出一个带权联通无向图,你需要从s走到t,你可以选择k条变让他们的权值为0问从s到t的最小权值是多少? 分析 思考一下,如果不带k条白嫖这个条件,那么这就是一个简单的dji就搞定了,我 ...

  10. 并发编程之CyclicBarrier

    栅栏类似于闭锁,它能阻塞一组线程直到某个事件的发生.栅栏与闭锁的关键区别在于,所有的线程必须同时到达栅栏位置,才能继续执行.闭锁用于等待事件,而栅栏用于等待其他线程. CyclicBarrier可以使 ...