当前位置：首页 > news >正文

JS-模块化

news 2025/10/5 9:50:58

在 JavaScript 中导入其他文件中的函数被称为 模块化。

核心概念：Export (导出) 和 Import (导入)

在 Node.js 环境中

1. 导出函数 (export)

2. 导入函数 (import)

总结

核心概念：Export (导出) 和 Import (导入)

要使用一个文件中的函数，需要两个步骤：

在被导入的文件中：使用 export关键字来暴露你想共享的函数。
在需要使用的文件中：使用 import关键字来引入这些被暴露的函数。

在 Node.js 环境中

Node.js 原生支持 ES6 模块。你需要确保你的 package.json文件中有 "type": "module"，或者使用 .mjs文件扩展名。

1. 导出函数 (export)

假设我们有一个名为 mathFunctions.js的文件。

方法一：命名导出 (Named Exports)

可以从一个文件导出多个值。
导入时必须使用相同的名字，并用花括号 {}包裹。

// mathFunctions.jsexport function add(a, b) {return a + b;
}export function multiply(a, b) {return a * b;
}// 或者先在文件底部统一导出
// function subtract(a, b) { return a - b; }
// export { subtract };

方法二：默认导出 (Default Export)

一个文件只能有一个 default export。
导入时可以任意命名。

// config.js
export default function getDatabaseUrl() {return 'http://my-database:3000';
}

2. 导入函数 (import)

在另一个文件（如 main.js）中导入。

导入命名导出：

// main.js
import { add, multiply } from './mathFunctions.js'; // 注意：需要.js扩展名console.log(add(5, 3)); // Output: 8
console.log(multiply(5, 3)); // Output: 15// 可以起别名 (alias) 以防命名冲突
import { add as addNumbers } from './mathFunctions.js';

导入默认导出：

// main.js
import getDatabaseUrl from './config.js'; // 名字可以任意取
import anyNameYouWant from './config.js'; // 这样也行console.log(getDatabaseUrl());

一次性导入所有命名导出：

// main.js
import * as MathUtils from './mathFunctions.js'; // 将所有导出放入一个名为MathUtils的对象中console.log(MathUtils.add(5, 3));
console.log(MathUtils.multiply(5, 3));