javascript 模块化编程

1、es5模块化编程是分为 require和amd两部分

 

2、主要知识点：

 

立即执行函数	保存私有变量
放大模式	传入对象，添加属性，再抛出来
宽放大模式	比放大模式多了默认值｛｝
全局变量	全局变量也必须输入

 

3、为什么模块很重要？

因为有了模块，我们就可以更方便地使用别人的代码，想要什么功能，就加载什么模块。

但是，这样做有一个前提，那就是大家必须以同样的方式编写模块，否则你有你的写法，我有我的写法，岂不是乱了套！考虑到Javascript模块现在还没有官方规范，这一点就更重要了。

目前，通行的Javascript模块规范共有两种： CommonJS和 AMD。

 

4、CommonJs, 也就是我们常用的require， 会把模块全部加载进来

但是， CommonJs是同步的，需要等模块加载进来，才能进行下一步，

所以我们需要AMD（Asynchronous Module Definition）。

 

第一次加载某个模块时，Node会缓存该模块。以后再加载该模块，就直接从缓存取出该模块的module.exports属性。

 

在每个模块内部，module变量代表当前模块。它的exports属性是对外的接口，将模块的接口暴露出去。其他文件加载该模块，实际上就是读取module.exports变量

 

CommonJS模块的加载机制是， 输入的是被输出的值的拷贝 。也就是说， 一旦输出一个值，模块内部的变化就影响不到这个值 。

 

 

4、AMD也采用require()语句加载模块，但是不同于CommonJS，它要求两个参数：

require([module], callback);

[module]里面的模块都是异步加载的，

当所有的模块全部加载完成之后，

才去执行 callback

 

5、模块必须采用特定的define()函数来定义

 加载模块的时候就采用 require，

所以使用AMD，需要显式的引入requirejs

 

6、 ES6正式提出了内置的模块化语法，我们在浏览器端无需额外引入requirejs来进行模块化。

 

使用 export 关键字将任意变量、函数或者类公开给其他模块。

 

重命名想导出的变量、函数或类的名称  export {sum as add}

 

模块的默认值是使用  default 关键字 所指定的单个变量、函数或类，而你在每个模块中 只能设置一个默认导出 。

 

export default function (num1, num2) { return num1 + num2; }

 

export 与 import 都有一个重要的限制，那就是它们必须被用在其他语句或表达式的外部，而不能使用在if等代码块内部。原因之一是模块语法需要让 JS 能静态判断需要导出什么，正因为此，你只能在模块的顶级作用域使用 export与import。