模块化

概述

模块化是指将一个复杂程序划分为一系列独立、可互操作的模块的过程。每个模块负责特定的功能或任务，并通过定义好的接口与其他模块进行通信。简单来说, 就是将代码进行分解、按功能进行管理。
模块化的目的是提高代码的可维护性、可重用性、可测试性和可扩展性。开发者能够更容易地处理大型JavaScript项目。

目录结构

默认导出和导入

js
1
2
3
4
5
6
7
8
9
min.js
export default function min(m, n)
{
    return m > n ? n : m
}

index.js
import min from './utils/min.js'
console.log(min(12, 45))

注意：

  • export default 在同一个模块中只能使用一次
  • 默认导入的变量名可以随便起，一般建议和模块功能保存一致。

按需导出和导入

按照导入的变量必须要用花括号括起来，并且变量名和导出名必须保持一致。

js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
math.js
export function add(x, y)
{
    return x + y
}

export function sub(x, y)
{
    return x - y
}

index.js
import {add, sub} from './utils/math.js'

console.log(add(12, 45))
console.log(sub(12, 45))
bash
1
2
3
4
PS F:\desktop\Front-end project\project1> node src/index.js
12
57
-33