js模块化世界

前言

我们经常见到 一些这样的写法,require('xxx')、import xx from '../components/data'、export const data、。。。也听见一些这样的说法:commonjs 规范、AMD规范。。。

其实 都是 属于模块化概念里的东西了。所谓模块化,就是将一些功能 独立化、块状化,易于被别人使用。这是代码开发向前的趋势了。这里主要说一下当前模块化的 主要规范。所谓规范,即 遵从的一些语法标准。

主要有三大规范:commonJS、AMD、es6模块化

commonJS:

同步加载依赖模块,require导入、module.exports导出。

语法:

// 导入
const moduleA = require('./moduleA'); // 导出
module.exports = moduleA.someFunc;

优点:

Node.js环境 可运行;npm的第三方模块 多使用 该规范

缺点:

浏览器环境不支持,须转换

注:CommonJS 还可以细分为 CommonJS1 和 CommonJS2,区别在于 CommonJS1 只能通过 exports.XX = XX 的方式导出,CommonJS2 在 CommonJS1 的基础上加入了 module.exports = XX 的导出方式。 CommonJS 通常指 CommonJS2。

AMD

异步加载模块。主要是为了解决浏览器环境的模块化问题,代表性 如 requirejs。

语法:

// 定义一个模块
define('module', ['dep'], function(dep) {
return exports;
}); // 导入和使用
require(['module'], function(module) {
});

优点:

可直接在浏览器环境运行;可并行加载多个模块;支持node环境和浏览器环境

缺点:

js环境 运行 需要amd库的支持。

Es6模块化

Import;export。取代 commonJS 和 AMD 成为 通用解决方案。

// 导入
import { readFile } from 'fs';
import React from 'react';
// 导出
export function hello() {};
export default {
// ...
};

缺点:

浏览器需要 转换为es5.

上一篇:dojo表格分页插件报错


下一篇:多线程系列之五:Balking 模式