使用 ES 模块增强 JavaScript 代码：导出、导入等

亲爱的编程学习爱好者，如果你点开了这篇文章，说明你对《使用 ES 模块增强 JavaScript 代码：导出、导入等》很感兴趣。本篇文章就来给大家详细解析一下，主要介绍一下，希望所有认真读完的童鞋们，都有实质性的提高。

javascript 模块是一种组织和重用 javascript 代码的方法。使用模块可以将代码分解为更小的、可管理的部分，然后可以根据需要将其导入并在应用程序的其他部分中使用。这种模块化方法有助于维护干净的代码库，使其更易于调试，并增强代码的可重用性。

es 模块与 commonjs

javascript 生态系统中有不同的模块系统。 es 模块 (esm) 是 ecmascript 规范中的标准，主要在浏览器中使用，并且越来越多地在 node.js 中得到支持。 commonjs 是传统上在 node.js 中使用的另一个模块系统。

es 模块 (esm)

es模块（esm）是javascript中的标准化模块系统，在ecmascript 2015（es6）中引入。它们通过启用不同文件之间的函数、对象和原语的导入和导出来实现更好的代码组织和可重用性。该模块系统在现代 javascript 环境中得到广泛支持，包括浏览器和 node.js。

导出和导入

export 关键字标记了应该可以从当前模块外部访问的变量和函数，从而允许它们在应用程序的其他部分中重用。 import 关键字允许从其他模块导入这些功能，从而实现模块化编程和代码重用。

命名导出允许从一个模块导出多个项目。每个项目导入时必须使用与导出时相同的名称。

//modules.js
const greet = () => {
   console.log('hello world');
};
export { greet};

导入命名导出时，需要使用与导出相同的名称。

import { greet } from './module.js';
greet(); // hello, world!

默认导出允许每个模块有一个默认导出。该项目可以用任何名称导入。

//modules.js
const greet = () => {
   console.log('hello world');
};
export default greet;

导入时默认导出，可以使用任意名称。

import message  from './module.js';
message(); // hello, world!

在 html 中使用模块

在浏览器中使用模块时，您需要将它们包含在 html 文件中。您在