从模块化到模块导入：require/exports vs import/export

2023-11-19 03:02:48

理解JavaScript模块化

JavaScript模块化是指将代码组织成独立的模块，每个模块包含一个或多个相关函数、类或变量。模块化可以帮助我们更好地组织和管理代码，提高代码的可读性、可维护性和可重用性。在大型项目中，模块化是必不可少的，它可以帮助我们轻松地管理和维护代码，避免代码变得难以理解和维护。

require/exports vs import/export

require/exports和import/export是JavaScript中两种常用的模块化方案。require/exports是CommonJS规范中定义的模块化方案，而import/export是ES6（ECMAScript 2015）中引入的模块化方案。

require/exports

require/exports是CommonJS规范中定义的模块化方案，它使用require()函数来导入模块，并使用exports对象来导出模块。require()函数接受一个模块的路径作为参数，并返回该模块导出的对象。exports对象是一个特殊的对象，用于导出模块。在模块中，我们可以通过修改exports对象来导出变量、函数或类。

// 模块A.js
exports.name = 'A';

// 模块B.js
const moduleA = require('./moduleA.js');
console.log(moduleA.name); // 输出：A

import/export

import/export是ES6中引入的模块化方案，它使用import来导入模块，并使用export关键字来导出模块。import关键字接受一个模块的路径作为参数，并返回该模块导出的对象。export关键字用于导出变量、函数或类。

// 模块A.js
export const name = 'A';

// 模块B.js
import { name } from './moduleA.js';
console.log(name); // 输出：A

require/exports和import/export的区别

require/exports和import/export的主要区别在于它们的语法和用法。require/exports使用require()函数来导入模块，并使用exports对象来导出模块；而import/export使用import关键字来导入模块，并使用export关键字来导出模块。此外，require/exports需要在模块的头部显式地声明模块的依赖，而import/export不需要。