import es6
在现代JavaScript开发中，ES6（ECMAScript 2015）引入了模块化系统，通过import和export关键字，使代码组织更加清晰、可维护性更强。介绍如何使用import语句来导入模块，并提供多种解决方案。
1. 使用 import 导入模块
import 导入模块ES6 的模块系统允许开发者将代码分割成多个文件，每个文件可以导出自己的功能或变量。要使用这些导出的内容，可以通过 import 语句将其导入到其他文件中。
解决方案
假设我们有一个数学工具库 math.js，其中定义了一些常用的数学函数。我们需要在另一个文件中使用这些函数。
math.js (导出模块)
javascript
// 导出具体的功能
export function add(a, b) {
return a + b;
}</p>
<p>export function subtract(a, b) {
return a - b;
}</p>
<p>// 导出一个对象
const pi = 3.14159;
export { pi };
main.js (导入模块)
javascript
// 从 'math.js' 文件中导入具体的函数
import { add, subtract, pi } from './math.js';</p>
<p>console.log(add(2, 3)); // 输出：5
console.log(subtract(5, 3)); // 输出：2
console.log(pi); // 输出：3.14159
2. 默认导出与导入
除了命名导出，ES6 还支持默认导出。默认导出的模块在导入时不需要使用大括号 {}。
math-default.js (默认导出)
javascript
// 默认导出一个函数
function multiply(a, b) {
return a * b;
}</p>
<p>export default multiply;
main-default.js (导入默认导出)
javascript
// 导入默认导出的函数
import multiply from './math-default.js';</p>
<p>console.log(multiply(2, 3)); // 输出：6
3. 全部导入
如果需要导入模块中的所有内容，可以使用通配符 * 来实现。
math-all.js (命名导出)
javascript
export function divide(a, b) {
return a / b;
}</p>
<p>export const e = 2.71828;
main-all.js (全部导入)
javascript
// 使用通配符 * 导入所有导出的内容
import * as math from './math-all.js';</p>
<p>console.log(math.divide(6, 2)); // 输出：3
console.log(math.e); // 输出：2.71828
4. 动态导入
除了静态导入外，ES6 还支持动态导入，即在运行时根据条件加载模块。这在按需加载场景下非常有用。
dynamic-import.js
javascript
// 模拟一个异步加载的模块
export function greet(name) {
return `Hello, ${name}!`;
}
main-dynamic.js (动态导入)
javascript
// 使用动态导入语法
async function loadGreeting() {
const module = await import('./dynamic-import.js');
console.log(module.greet('World')); // 输出：Hello, World!
}</p>
<p>loadGreeting();
通过以上几种方式，我们可以灵活地使用 ES6 的模块化系统，无论是命名导出、默认导出还是动态导入，都能满足不同的开发需求。
