(JS 🔄 TS) import 🆚 export 用法小结 😊

在前端开发中，`import` 和 `export` 是模块化编程的核心语法。无论是 JavaScript 还是 TypeScript，它们都扮演着不可或缺的角色。简单来说，`export` 用于导出功能，而 `import` 则用来引入这些功能。

1️⃣ 基础用法

`export` 可以直接导出变量、函数或类。例如：

```javascript

// utils.js

export const PI = 3.14;

export function greet(name) {

return `Hello, ${name}`;

}

```

对应的 `import` 可以这样使用：

```javascript

// main.js

import { PI, greet } from './utils';

console.log(greet('Alice')); // 输出: Hello, Alice

```

2️⃣ 默认导出

如果一个模块需要导出唯一内容，可以使用默认导出：

```javascript

// math.js

export default function add(a, b) {

return a + b;

}

```

引入时无需大括号：

```javascript

// main.js

import add from './math';

console.log(add(2, 3)); // 输出: 5

```

3️⃣ 命名与混合导出

结合命名和默认导出，灵活性更高：

```javascript

// index.js

export { PI } from './utils';

export default greet;

```

掌握 `import` 和 `export` 不仅能提升代码可读性，还能避免全局污染。快去试试吧！💪✨

　　免责声明：本文由用户上传，与本网站立场无关。财经信息仅供读者参考，并不构成投资建议。投资者据此操作，风险自担。 如有侵权请联系删除！