第五篇，理解JS模块化编程思想

模块化编程

·模块化编程是一种处理复杂系统分解成更好的可管理模块的方式，它可以把系统代码划分为职责单一高度解耦切可替代的模块。

·系统中某一部分的变化将如何影响其他部分就会变得显而易见，系统的可维护性更加简单易得。

    引入模块化就是为了降低系统的可维护性，把成本降低，把一个复杂的项目解耦成为一个细小单一的模块，这样好维护好开发出现问题也可以快速的锁定。

模块化发展历史

1. 早期函数封装

function foo() { //... }

好处：可以把复杂的应用进行解耦

缺点：污染全局命名空间

    2.nameEspace
        var obj = {
            count: 1,
            foo: function() { //... }
        }
        好处：解决污染全局命名空间
        缺点：私有成员暴露，内部状态可被外部改写

    3.立即执行函数
        (function(root) {
            //...
        })(this)
        好处：避免上面两个问题
        缺点：提供逻辑划分，不解决代码本身问题

不使用模块化开发之前我们需要考虑的问题。

1.可维护成本。

2.命名空间。

3.依赖管理。

Commonjs

CommonJS 规范加载模块是同步的，也就是说，加载完成才执行后面的操作，Node.js主要用于服务器编程模块都是存在本地硬盘中加载比较快，所以Node.js采用CommonJS规范。

CommonJS规范分为三部分：module（模块标识）require（模块引用）exports（模块定义）

module 变量在每个模块内部，就代表当前模块；

exports 属性是对外的接口，用于导出当前模块的方法或变量；

require() 用来加载外部模块，读取并执行js文件，返回该模块的exports对象；

    Commonjs里的规范每一个文件就是一个模块，它们都会有自己的作用域。，以文件做为一个作用域。但是有一个问题commonjs它这种规范只适用于服务端。因为在服务端它是具有同步去加载模块的条件的，如果换作是在浏览器客户端使用commonjs 这个规范，我们知道在浏览器客户端使用的是ECMA规范，JS天生异步，所以不能去同步加载模块，比如说前面加载的模块造成了阻塞，后面的东西就显示不出来了。所以在客户端这个先天条件下是不适用的。

AMD（require.js）

AMD 也就是异步模块定义。它采用异步的方式去加载模块。通过define方法去定义模块。requrie方法去加载模块。

    AMD模块定义
    如果这个模块还需要依赖其他模块，那么define函数的第一个参数，必须是一个数组，指名该模块的依赖。
    define([tools],function() { //... });

    AMD模块的加载
    require([module], callback);
    第一个参数[module]，是一个数组里面的成员就是需要加载的模块；第二个参数callback，则是加载成功之后的回调函数。例如加载math.js。
    require([math], function(math) { //... });

    require()异步加载math，浏览器不会失去响应；它指定的回调函数，只有前面的模块都加载成功后，才会运行，解决了依赖性的问题。
    AMD有一个不足就是依赖前置，如果用不到的模块这样就带来了不必要的性能消耗。

依赖前置？ "懒加载的书写方式 用到了谁就加载谁" 异步加载

ES6 module