《webpack篇》AMD规范和CommonJs规范
AMD规范是什么
参考链接：https://blog.csdn.net/qq_43267592/article/details/103918703
1、定义
AMD规范全称是Asynchronous Module Definition，即异步模块加载机制。它完整描述了模块的定义，依赖关系，引用关系以及加载机制。
2、应用
AMD对应的就是很有名的RequireJS。下面看一下如何使用require.js
（1）下载require.js，https://requirejs.org/docs/download.html
（2）引用js
<script src="js/require.js" data-main="js/main"></script>
//data-main属性的作用是，指定网页程序的主模块，它会在require.js加载完成后首个加载
（3）语法
define([id], [dependencies], factory)
//参数：
//id：可选，字符串类型，定义模块标识，如果没有提供参数，默认为文件名
//dependencies：可选，字符串数组，AMD 推崇依赖前置，即当前模块依赖的其他模块，模块依赖必须在真正执 行具体的factory方法前解决
//factory：必需，工厂方法，初始化模块需要执行的函数或对象。如果为函数，它只被执行一次。如果是对象，此对象会作为模块的输出值。
例如：
define(['jquery'], function () {
// 方法
function myFunc(){};
// 暴露公共方法
return myFunc;
});
（4）模块写法
一般情况下主模块都会依赖于其他模块，此时则需要使用AMD规范定义的的require()函数
require(['moduleA', 'moduleB', 'moduleC'], function (moduleA, moduleB, moduleC){
// 代码
});
// require()函数接受两个参数。
// 第一个参数是一个数组，表示所依赖的模块，上例就是[‘moduleA’, ‘moduleB’, ‘moduleC’]，即主模块依赖这三个模块；
// 第二个参数是一个回调函数，当前面指定的模块都加载成功后，它将被调用。
加载的模块会以参数形式传入该函数，从而在回调函数内部就可以使用这些模块。
require()异步加载moduleA，moduleB和moduleC，浏览器不会失去响应；它指定的回调函数，只有前面的模块都加载成功后，才会运行，解决了依赖性的问题。
例子：假定主模块main.js依赖jquery、underscore和backbone这三个模块，就可以这样写：
require(['jquery', 'underscore', 'backbone'], function (Backbone){
// 代码
});
require.js会先加载jQuery、underscore和backbone，然后再运行回调函数。主模块的代码就写在回调函数中。
CommonJs是什么
参考链接：https://www.cnblogs.com/xixiaoxi/p/12588784.html
参考链接：https://www.cnblogs.com/lizhitong/p/14242365.html
1、定义
CommonJS是一种被广泛使用的js模块化规范，核心思想是通过require方法来同步加载依赖的其他模块，通过module.exports导出需要暴露的接口。
2、使用
（1）Module对象
Node内部提供一个Module构建函数。所有模块都是Module的实例。
//a.js文件中输出module对象
console.log(module);
输出：
Module {
//模块的识别符，通常是带有绝对路径的模块文件名。
id: '.',
//当前模块的路径
path: 'C:\\Users\\LiZhiTong\\Desktop\\webpack资料\\test\\01',
//表示模块对外输出的值。
exports: {},
//表示调用该模块的模块。
parent: null,
//模块的文件名，带有绝对路径。
filename: 'C:\\Users\\LiZhiTong\\Desktop\\webpack资料\\test\\01\\a.js',
//返回一个布尔值，表示模块是否已经完成加载。
loaded: false,
//返回一个数组，表示该模块要用到的其他模块。
children: [],
//模块的搜索路径（依次向上级目录搜索）
paths: [
'C:\\Users\\LiZhiTong\\Desktop\\webpack资料\\test\\01\\node_modules',
'C:\\Users\\LiZhiTong\\Desktop\\webpack资料\\test\\node_modules',
'C:\\Users\\LiZhiTong\\Desktop\\webpack资料\\node_modules',
'C:\\Users\\LiZhiTong\\Desktop\\node_modules',
'C:\\Users\\LiZhiTong\\node_modules',
'C:\\Users\\node_modules',
'C:\\node_modules'
]
}
（2）exports
module.exports属性表示当前模块对外输出的接口，它是一个对象，其他文件加载该模块，实际上就是读取module.exports变量。
每个模块内部，module变量代表当前模块。这个变量是一个对象，它的exports属性（即module.exports）是对外的接口。加载某个模块，其实是加载该模块的module.exports属性。
//一般直接使module.exports指向一个新的对象，并向外提供资源
module.exports = {
num: 1,
msg: "hello",
getNum() {
return this.num;
},
setMsg(str) {
this.msg = str;
}
};
（3）require
require命令的基本功能是，读入并执行一个JavaScript文件，然后返回该模块的exports对象。如果没有发现指定模块，会报错。
const info=require('./lib');//后缀名可以省略,默认为.js,
根据参数的不同格式，require命令去不同路径寻找模块文件,如果参数字符串不以“./“或”/“开头，则表示加载的是一个默认提供的核心模块（位于Node的系统安装目录中），或者一个位于各级node_modules目录的已安装模块（全局安装或局部安装）。
AMD和CommonJs的区别
CommonJS和AMD都是用于JavaScript模块化的标准。它们的主要区别在于依赖加载方式和用途。
CommonJS是一种用于后端JavaScript环境（如Node.js）的模块化规范，它支持同步加载，也就是在模块内部同步地加载依赖。在Node.js中，模块使用require()函数来引入其他模块，并使用module.exports来导出模块接口。
而AMD（异步模块定义）则是一种用于前端JavaScript环境（如浏览器）的模块化规范，它支持异步加载，也就是在模块内部异步地加载依赖。在AMD中，模块使用define()函数来定义，使用require()函数来异步加载其他模块。
另外，AMD通常用于浏览器端的模块化开发，而CommonJS通常用于后端开发和构建工具（如Webpack）中。由于AMD具有异步加载的能力，因此更适合于大型Web应用程序中的动态加载，而CommonJS更适合于小型应用程序的快速启动。
总的来说，CommonJS和AMD都是有效的标准，选择哪种标准主要取决于项目的具体需求和场景。
