前言
承接上一篇《ES6模块(Module)加载知识总结（一）》的两个问题，
1、 由于index.js导入了所有的组件，然后其他页面使用时直接加载index.js，如果我只用到其中的一两个组件，那index.js中的其他组件会不会都加载了，如果真的加载了岂不是造成内存的浪费？
2、 RN中有require、exports、module.exports，还有import、export，这些都是一样的东西吗？
这里解答一下：
ES6中的模块加载机制
历史上，JavaScript 一直没有模块（module）体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。在 ES6 之前，社区制定了一些模块加载方案，最主要有 CommonJS 和 AMD 两种。之后ES6 在语言标准的层面上，实现了模块功能，而且实现得相当简单，完全可以取代 CommonJS 和 AMD 规范。下面通过对比CommonJS和ES6的模块功能来理解ES6模块加载。
首先，CommonJS 模块就是对象，通过module.exports命令导出对象，通过require命令导入对象，输入时必须查找对象属性。
// CommonJS模块
// index.js
moudle.exports = { NavBar, AlertBox, ChooseBox };
// Home.js
var { NavBar, AlertBox, ChooseBox } = require('../../../components/index');
// 等同于
var index = require('../../../components/index');
var NavBar = index.NavBar;
var AlertBox = index.AlertBox;
var ChooseBox = index.ChooseBox;
上面代码的实质是整体加载index模块，生成一个对象index，然后再从这个对象上面读取3个属性。这种加载称为“运行时加载”，因为只有运行时才能得到这个对象。运行时，当遇到require命令，就会全部执行，输出已执行部分，未执行部分不输出（这也是CommonJS解决循环加载的办法）。由于require导入的是输出值得拷贝。也就是说，一旦输出一个值，模块内部的变化就影响不到这个值，反过来亦然。
而ES6 模块的运行机制与 CommonJS 不一样。ES6 模块的设计思想，是尽量的静态化，使得编译时就能确定模块的依赖关系，以及输入和输出的变量。通过export命令导出，import命令导入。JS 引擎对脚本静态分析的时候，遇到模块加载命令import，就会生成一个只读引用。等到脚本真正执行时，再根据这个只读引用，到被加载的那个模块里面去取值。换句话说，ES6 的import有点像 Unix 系统的“符号连接”，原始值变了，import加载的值也会跟着变。因此，ES6 模块是动态引用，并且不会缓存值。这样宏（macro）和类型检验（type system）这些只能靠静态分析实现的功能就有机会在JS里实现了。但是由于import是静态执行，所以不能使用表达式、变量、if结构，这些只有在运行时才能得到结果的语法结构，也就无法直接实现条件加载，按需加载等功能。
总结起来就是：
CommonJS 模块是运行时加载，ES6 模块是编译时输出接口。
CommonJS 模块输出的是值的拷贝，ES6 模块输出的是值的引用。
所以问题1在ES6模块下得到解决。
require、exports、module.exports还有import、export的区别
首先看一下他们的使用范围：
require: node 和 es6 都支持的引入
module.exports / exports: 只有 node 支持的导出
export / import : 只有es6 支持的导出引入
在node模块里是遵循CommonJS规范的，执行模块文件时，会同时生成一个module对象和一个exports对象，而module对象又有一个exports属性，他们初始化时指向同一块{}内存区域，注意是同一块。即exports对象是module.exports的引用。看个例子理解一下：
// test.js
var module.exports = {};
var exports = module.exports;
console.log(module.exports); // {}
console.log(exports); // {}
exports.name = 2;
console.log(module.exports); // {name: 2}
console.log(exports); // {name: 2}
var exports = {name: 3};
console.log(module.exports); // {name: 2}
console.log(exports); // {name: 3}
所以从上面可以看出
其实require导出的内容是module.exports指向的内存块内容，并不是exports的。
区分他们之间的区别就是exports只是module.exports的引用，辅助后者添加内容用的。
当其中一个指向另一块内存时，两者便没什么关系了。
而ES6里的模块就非常清晰了，export导出引用，import导入引用。具体用法请参考大神的文章《Moudle的语法》
参考文章
1、《Module 的加载实现》
2、《exports、module.exports和export、export default到底是咋回事》
如果觉得文章对你有用，记得点赞喔，亲！
