Js模块化

模块化介绍

为什么要模块化

• 降低复杂度
• 降低耦合性
• 部署方便

模块化的好处

• 避免命名冲突
• 更好的分离，按需加载
• 更高的复用性
• 高可维护性

模块化规范

commonJS

规范

说明:

• 每一个js文件都可以当做一个模块
• 在服务器端:模块的加载运行是同步加载的(阻塞)
• 在浏览器端:模块需要提前编译打包处理

基本语法:

暴露模块：

• 暴露的本质都是 exports 这个对象

1. module.exports = value
2. exports.xxx = value

引入模块

• require(xxx)

  1. 第三方模块：xxx为模块名
  2. 自定义模块: xxx为模块文件路径

实现

服务器端实现

• Node.js
• nodejs.cn/

浏览器端实现

• Browserify
• browserify.org/
• 也称为CommonJS的浏览器端打包工具

Node与Browserify的区别

ES6

规范

说明

• 依赖模块需要打包编译处理

语法

导出模块

• export

引入模块

• import

实现(浏览器端)

• 使用Babel将ES6编译为ES5代码
• 使用Browserify编译打包js