在编写软件的时候，非常提倡模块化的做法，不管是当初的面向过程的编程方式，还是现在面向对象的编程方式，模块化都很重要。而过程和函数更是模块化的产物，至于OSGi中的bundle，更是把模块化提升到新的高度。
模块化应该是一个借鉴的结果，最早的模块化从何而来，已经无从考证，但是看看其他学科中，模块化的存在已经有一段时间了。
比方说建筑学，活动房或者一些新的建筑方式中就体现了模块化的思想，先制造出一些可以直接利用的组件，然后在建筑工地上直接组合，就可以造出一片房子来。
再比方在电子领域，体现的更为突出，集成电路把很多电阻、电容等等小部件组合在一起，这样在制造电器的时候并不需要从头做起，而是直接拿过来使用就好。
模块化的思想基于划分的思想，或者说是分类的思想，就是要把类似的、相互关联的内容放在一起管理，从而从总体上简化过程。而每个模块的内部可能比较复杂，但暴露给外部的接口会比较简单，那样使用的时候，就不用考虑内部的复杂性，从而简化问题。
模块的好处更多在于能够批量生产和重复利用，软件领域有句话说“不要重复制造轮子”，轮子其实就是汽车制造行业中的一个大模块，汽车制造厂更多的是在组装轮子，而不是制造轮子。而软件开发领域同样不需要什么内容都从头开始编写，如果有现成的程序库，大可以拿过来直接使用，那样不仅能够提高效率，还可以降低出错的几率。
生活有时同样可以模块化，比方说对时间的管理，我们可以按照番茄工作法，把时间划分为小的时间段，然后在每个时间段内分配类似的工作或者事情，从而更好地集中精力来做好这件事。再比方，在做各种事情的经验上，其实也是在头脑中形成了不同的模块来放置，并进行了归类。在解决新的问题时，就会把经验从大脑的各个存储领域取出来，组合出一套新的解决方案来。
分解和组合是对模块使用的重要方式，分解可以让我们了解内部的细节，在模块出现问题的时候，可以知道如何解决。而组合可以把小的模块形成大的模块，再把大的模块组合成更大的模块，直到形成我们想要的事物。
模块化体现的哲学思想，有“一生二，两仪生四象，四象生八卦”的思想，也有分而治之的思想，也有大事化小，小事化了的思想，总之这几种都有异曲同工之妙。

什么是模块化，模块化的好处是？

模块化是一种处理复杂系统分解为更好的可管理模块的方式。

所谓的模块化开发就是封装细节，提供使用接口，彼此之间互不影响，每个模块都是实现某一特定的功能。模块化开发的基础就是函数。模块化开发使用代码耦合度降低，模块化的意义在于最大化的设计重用，以最少的模块、零部件，更快速的满足更多的个性化需求。

模块化的好处

优点：

a .  可维护性

1、灵活架构，焦点分离

2、方便模块间组合、分解

3、方便单个模块功能调试、升级

4、多人协作互不干扰

b .  可测试性

可分单元测试

 

拓展：

缺点：

性能损耗

1、系统分层，调用链会很长

2、模块间发送消息会很耗性能

 

补充：

内聚度

内聚度指模块内部实现，它是信息隐藏和局部化概念的自然扩展，它标志着一个模块内部各成分彼此结合的紧密程度。好处很明显。当把相关的任务分组后去阅读就容易多了。设计时应该尽可能的提高模块内聚度，从而获得较高的模块独立性。

耦合度

耦合度则是指模块之间的关联度的度量。耦合度取决于模块之间接口的复杂性，进入或调用模块的位置等。与内聚度相反，在设计时应尽量追求松散耦合的系统。

什么是模块化
简单地说，模块化就是有组织地把一个大文件拆成独立并互相依赖的多个小模块。

模块内部有许多私有属性，只向外暴露一部分公开的接口(如可以修改私有属性的方法等)

模块化是一种处理复杂系统分解为更好的可管理模块的方式。

所谓的模块化开发就是封装细节，提供使用接口，彼此之间互不影响，每个模块都是实现某一特定的功能。模块化开发的基础就是函数。模块化开发使代码耦合度降低，模块化的意义在于最大化的设计重用，以最少的模块、零部件，更快速的满足更多的个性化需求。

模块化的好处

ES6之前，JavaScript语言一直没有模块（module）体系，无法把大文件有组织地划分成小块，并管理之间地依赖。但是模块化的思想一直存在。因为用Javascript写的代码越来越庞大，而网页也越来越像桌面APP。如此庞杂的代码，如果不进行模块化，就可能引发命名冲突，造成不易复用、维护性高。
使用模块化开发好处
1.高内聚低耦合，有利于团队作战，当项目很复杂的时候，将项目划分为子模块分给不同的人开发，最后再组合在一起，这样可以降低模块与模块之间的依赖关系体现低耦合，模块又有特定功能体现高内聚。
2.可重用，方便维护，模块的特点就是有特定功能，当两个项目都需要某种功能的时候，我们定义一个特定的模块来实现该功能，这样只需要在两个项目中都引入这个模块就能够实现该功能，不需要书写重复性的代码；并且当需求变更该功能需要改变的时候，我们直接修改该模块，这样就能够修改所有项目的功能，维护起来很方便。

3、通过 exports 暴露接口。这意味着不需要命名空间了，更不需要全局变量。这是一种彻底的命名冲突解决方案。

4、通过 require 引入依赖。**这可以让依赖内置，开发者只需关心当前模块的依赖，其他事情 Sea.js/ Require.js 都会自动处理好

前端模块化
前端模块化是什么
所谓模块化，就是指根据功能的不同进行划分，每个功能就是一个模块。最终，一个完整的产品是由各个模块组合而成的。

模块化的特点:

独立性。可以针对一个模块单独进行设计、研发，相对工作量和难度变小。
复用性。一些通用模块(例如登录或注册)可以被重复使用，而不用每次重新开发。
解耦性。模块与模块Z间，付作一永P所l块的工作。
灵活性。通过选择和组合不同的模块，可以快速构建一个新的产品。

ECMAScript5的模块化
函数的封装
函数的定义可以将代码逻辑封装在指定的函数作用域中。可以将函数的封装作为自定义模块化的第一步:
functien outer(){
	var v= '卧龙学苑';
    function inner(){
		return 'this is inner function.';
    }
}

上述代码示例中，定义了outer()函数，方便在后面的逻辑中进行调用。outer()函数就可以看作是一个模块。
但是，这样的做法有着明显的缺点，就是污染了全局命名空间。换句话讲，无法在全局作用域再定义一个 outer()函数。
对象的自定
为了解决封装函数所带来的问题，可以引入JavaScript对象的概念。就是把所有相关的模块成员封装在一个对象中。
var outer = {
	v: '卧龙学苑',
    inner: function () {
		return 'this is inner function.';
    }
}

如上述代码示例，使用对象实现的好处:

解决了全局命名空间可能出现的冲突问题。因为所有的模块成员都是作为一个对象的属性或方法存在的。
模块成员之间也存在着某种关系。因为被定义在同一个JavaScript对象中，作为属性或方法存在。而这个对象名成为了所有模块成员对外的一个统一的模块名称。

自调函数
看似引人对象概念后，这个模块的解决方案不错，但依旧存在着一些问题。对于这样一个模块(对象），是可以从外部对该模块（对象）的属性或方法进行修改的。这就导致了会产生一些意外的安全问题，而这个问题可以通过自调函数来进行解决。
var outer = (function () {
	var v = 'longestory';
    function inner() {
		return 'this is inner function.';
    }
})();

最终模块化结构
如果想要在真实开发中使用模块化概念，代码结构还需要进一步优化。
var outer = (function () {
	var v = 'longestory';
    var interface = {
		getAttr: function () {
            return v;
		},
		inner: function () {
			return 'this is inner function.';
		}
    }
	return interface;
})();

ECMAScript6的模块化
ECMAScript 2015提供了基于原生的模块化概念。一个ECMAScript 2015的模块就是一个单独的JavaScript 文件，与普通的JavaScript 文件之间仅有两个区别:

ECMAScript 2015的模块自动开启严格模式，即使没有写use strict。
可以在模块中使用import和export 命令。

export命令
export命令用于将指定的模块内容导出，该命令可以修饰在function、var、let或 const等之前。
export var v = 100;
export let = 'this is string.';
export function fn(){
	return 'this is function.';
}

export命令除了上述方式以外，还可以这样编写:
var v= 100;
let l = 'this is string.';
function fn(){
	return 'this is function.';
}
export { v, l, fn }

上述两种写法是等价的。但一般建议使用第二种写法，因为这样更直接，更清晰。
import命令
import命令用于导人其他模块所提供的功能，基本语法如下:
import {...} from modulepath;

根据上述语法结构，可以通过import命令导入其他模块:
import {v,l,fn} from './temp.js';

值得注意的是，使用import命令导入的名称必须与模块使用export导出的名称一致。

使用import命令导入其他模块的内容时，默认使用的是模块声明的名称。也可以在导入时，进行重命名。
import { v as variable } from './temp.is';

前端模块化规范
模块化开发可以将复杂的Web应用程序拆分成若干个模块，模块之间的相互依赖很低。使得开发结构更为清晰，依赖更为明确。在实际开发中，经常引人第三方的模块，例如 jQuery库等。
但是，ECMAScript 官方到目前为止并没有为模块化提供一个统一的标准规范，这可能导致每个模块的编写方式不同。
目前，最为流行的JavaScript模块化规范具有以下几种:

CommonJS
RequireJS
SeaJS

CommonJS
2009年，美国程序员Ryan Dahl创造了Nodejs 项目，将JavaScript语言用于服务器端编程。这标志“JavaScript模块化编程”正式诞生。
Nocejs,的模块系统，就是参照CommonJS规范实现的。在CommonJS 中，有一个全局性方法require()，用于加载模块。
CommonJS的Modules规范实现了一套简单易用的模块系统，ComnmonJS对模块的定义也十分的简单。主要分为模块定义、模块引用及模块标识三个部分。
RequireJS
RequireJS是一个JavaScript模块加载器。它非常适合在浏览器中使用。
RequireJS是一个基于AMD规范实现的函数，它区别于传统的CommonJS的require 规范。因为它能够异步地加载动态的依赖。
AMD( Asynchronous Module Definition，译为异步模块定义）是一个在浏览器端模块化开发的规范。模块将被异步加载，模块加载不影响后面语句的运行。所有依赖某些模块的语句均放置在回调函数中。
AMD是RequiceJS在推广过程中对模块定义的规范化的产出。
加载RequireJS
在HTML页面中通过 <script> 元素引人RequireJS，如下示例代码:
<script src="scripts/reauire.is"></script>

这样加载 JavaScript 文件可能导致HTML页面失去响应。解决办法有两种，一是将

件的引入代码放置在HTML页面的底部，二是将代码改写成如下方式:
<script src="scripts/ require.is" defer async="true" ></script>

async属性表示异步加载 JavaScript 文件，避免HTML页面失去响应。但是E浏览器不支持该属性，可以利用defer 属性进行替换。
主模块的编写
通过如下方式定义 RequireJJS 的主模块:
<script data-main="scripts/main.is" src="scripts/require.is" defer async="true" ></script>

data-main属性表示设置当前HTML页面程序的主模块。由于require.js 默认的文件后缀名是 js,所以可以把 main.js简写成main。
定义模块
RequireJS使用define()函数来定义一个模块。定义模块的常见形式如下:

键值对方式定义
函数式定义
存在依赖的函数式定义

define(["./cart", "./inventory"], function (cart, inventory) {
  //return an object to define the "my/shirt" module.
    return {
    `  color: "blue",
	   size: "large",
       addToCart: function (){
           inventory.decrement(this);
           cart.add(this);`
       }
    } 
});

加载模块
RequireJS使用config()函数对模块的加载行为进行自定义。
require.config({
	paths: {
		"jquery": "jquery.min",
		"underscore": "underscore.min",
        "backbone": "backbone.min"
    }
});

RequireJS 使用require()函数来加载指定模块。
require(['jquery', 'underscore', 'backbone'], function ($,_, Backbone) {
	//some code here
});

SeaJS
Sea.js追求简单、自然的代码书写和组织方式，具有以下核心特性:


简单友好的模块定义规范: Seajs 遵循CMD规范，可以像Nodejs一般书写模块代码。


自然直观的代码组织方式:依赖的自动加载、配置的简洁清晰，可以让我们更多地享受编码的乐趣。Seajs 还提供常用插件，非常有助于开发调试和性能优化，并具有丰富的可扩展接口。


CMD (Common Module Definition，译为通用模块定义）规范明确了模块的基本书写格式和基本交互规则。该规范是在国内发展出来的。
CMD是 SeaJS在推广过程中对模块定义的规范化的产出。
加载SeaJS
在HTML页面中通过 <script> 元素引人 SeaJS，如下示例代码:
<script src="scripts/sea.is"></script>

这样加载JavaScript 文件可能导致HTML页面失去响应。解决办法有两种，一是将JavaScript文件的引入代码放置在HTML页面的底部，二是将代码改写成如下方式:
<script src="scripts/sea.is" defer async="true" ></script>

async属性表示异步加载 JavaScript 文件，避免HTML页面失去响应。但是IE浏览器不支持该属性，可以利用defer 属性进行替换。
加载模块
SeaJS利用config()方法进行配置:ll seais的简单配置：
seajs.config({
	base: "./seajs/",
    paths: {
        module: "module"
    }
    alias: {
		"hello": "module"
    }
})

SeaJS利用use()方法加载模块:/加载入口模块
seajs.use("hello",function(value){
    var h1 = document.createElement("h1");
    h1.textContent = value.hello;
    document.body.appendChild(h1);
});

定义模块
SeaJS利用define()方法定义模块:
// 所有模块都通过define来定义
define(function (require, exports, module) {
    // 通过require引入依赖
    var $ = require('jquery');
    var Spinning = require('./spinning');
    
    // 通过exports对外提供接口
    exporto.doSomething= ...
    // 或者通过module.exports提供整个接口
    module.exports = ...
});