JavaScript如何使用模块_JavaScriptES6模块importexport使用方法教程

// math.js
export const PI = 3.14159;
<p>export function add(a, b) {
return a + b;
}</p><p>function multiply(a, b) {
return a * b;
}</p><p>export { multiply }; // 单独导出

// calculator.js
export default function(a, b) {
  return a - b;
}

// Person.js
export default class Person {
  constructor(name) {
    this.name = name;
  }
<p>greet() {
console.log(<code>Hello, I'm ${this.name}</code>);
}
}

// main.js
import { PI, add, multiply } from './math.js';
<p>console.log(PI);           // 3.14159
console.log(add(2, 3));    // 5
console.log(multiply(4, 5)); // 20

// main.js
import subtract from './calculator.js';
console.log(subtract(10, 4)); // 6
<p>import Person from './Person.js';
const p = new Person("Alice");
p.greet(); // Hello, I'm Alice

import Person, { PI, add } from './utils.js';

import * as MathUtils from './math.js';
console.log(MathUtils.PI);
console.log(MathUtils.add(2, 3));

<script type="module" src="main.js"></script>

// utils/index.js
export { default as formatDate } from './formatDate.js';
export { default as validateEmail } from './validateEmail.js';
export * from './constants'; // 导出所有命名导出

import { formatDate, validateEmail, API_URL } from './utils/index.js';