模块加载-模块化解决方案

[XinChou16]

@CreatedAt: 20190602

TL;DR

1.模块系统概述

2.自定义模块规范

1. 模块系统概述

把系统分离成独立功能的方法，需要什么功能就加载什么功能

项目复杂，会遇到一些问题：

1. 命名冲突
2. 文件依赖

模块化可以避免以上问题，提高开发效率：

1. 可维护性
2. 可复用性

总结：

从生产角度看，模块化开发是一种生产方式，这种方式维护成本低，开发效率高。

2. 模块化开发历史

1. 全局函数

存在问题：

• 污染全局变量
• 看不出相互的直接关系

2. 对象命名空间

存在问题：

• 内部状态可以被外部改写
• 命名空间越来越长

3. 私有公有成员分离

解决了变量名冲突的问题，但没有解决降低开发复杂度的问题

3. Commonjs

1. 同步加载。加载完成后再执行
2. Node.js 采用 CommonJS规范

规范划分：

1. module(模块标识)：module 变量在每个模块内部，代表当前模块；
2. exports（模块定义）：对外接口，用于导出当前模块的方法或者变量；
3. require（模块引用）：用于加载外部模块，读取并执行js文件，返回当前模块的exports对象

4. AMD

异步模块

通过一部方式加载模块，通过 define 方法定义模块，require 方法去加载模块

5. CMD(seajs)

通用模块定义

依赖就近，延迟执行，文件提前加载好，require才去执行文件

define(function(require, exports, module) {
  var math = require('./math');
  math.add(1, 2);
});

6. ES6(import, export)

1. 动态运行机制，如果使用 import 从一个模块加载变量，变量不会被缓存
2. 引入的变量会成为一个只读引用，加载的时候会再去那个模块去取值