3、JavaScript 模块、类与设计模式全解析

JavaScript 模块、类与设计模式全解析

1. JavaScript 模块的优势

模块化编程和使用模块具有以下独特优势：
- 脚本仅评估一次 ：浏览器仅对模块脚本评估一次，而经典脚本每次添加到 DOM 时都会被评估。这意味着在 JS 模块中，如果存在依赖模块的扩展层次结构，依赖最内层模块的模块将首先被评估。
- 自动延迟加载 ：与其他脚本文件不同，无需使用 defer 属性，浏览器会自动延迟加载模块。
- 易于维护和重用 ：模块促进代码解耦，各部分可独立维护，且允许在多个不同函数中重用相同代码。
- 提供命名空间 ：模块为相关变量和常量创建私有空间，可通过模块引用，而不会污染全局命名空间。
- 实现死代码消除 ：借助模块导入，Webpack 和 rollup 等打包工具可自动识别未使用的模块并将其消除，即“摇树优化”。

所有现代浏览器都支持模块的导入和导出，可直接使用。

2. 带构造函数、获取器和设置器的类

ES2015+ 允许使用 class 关键字定义带有构造函数和一定隐私性的类。以下是一个 Cake 类的示例：

class Cake{
    constructor( name, toppings, price, cakeSize