AMD 和 Commonjs 的区别是什么？ - 前端面试题

AMD（Asynchronous Module Definition）和CommonJS是两种流行的JavaScript模块化规范，它们都被设计来允许代码分割成可重用的模块。但是，它们在模块定义、加载机制和使用场景上有所不同。

AMD（Asynchronous Module Definition）

主要特点：

异步加载： AMD被设计用于浏览器环境，可以异步加载模块，不会阻塞页面渲染。
定义模块： 使用define函数定义模块，可以显式声明依赖，并在所有依赖加载完成后运行模块的工厂函数。
依赖前置： 依赖需要在模块开始加载之前声明，这样可以并行加载依赖。

示例：

javascript
define(['dependency1', 'dependency2'], function (dep1, dep2) {
    // 定义模块内容
    var moduleName = function () {
        // 一些功能
    };
    return moduleName;
});

实现库： RequireJS 是最著名的实现AMD规范的库。

CommonJS

主要特点：

同步加载： CommonJS被设计用于服务器环境，如Node.js，通常假设模块是在本地文件系统中，因此可以同步加载，不会造成浏览器卡顿。
定义模块： 使用exports对象或module.exports定义模块的对外接口。
后置依赖： 依赖关系通常是在模块的代码体内通过require调用来声明的。

示例：

javascript
var dep1 = require('dependency1');
var dep2 = require('dependency2');

function moduleName() {
    // 一些功能
}

module.exports = moduleName;

实现环境： Node.js 原生支持CommonJS模块规范。

总结区别

加载方式：AMD为异步加载，适合浏览器环境；CommonJS为同步加载，适合服务器环境如Node.js。
定义模块：AMD使用define方法，CommonJS使用exports或module.exports。
依赖声明：AMD的依赖声明是前置的，而CommonJS依赖通常在需要时才声明。
实现和适用环境：AMD的典型实现是RequireJS，主要用在浏览器端；CommonJS的实现是Node.js的模块系统，主要用在服务器端。

在实际应用中，如果是开发面向浏览器的应用，并且需要异步加载模块，可能会倾向于使用AMD规范。如果是开发Node.js服务器端应用，CommonJS会是一种更加自然的选择。现代开发中，也有越来越多的工具和语法（如ES6模块）被用来跨越这两种规范的限制，实现更统一的模块化开发体验。