在前端开发中，模块化是一种常用的编程方式。通过模块化的方式，可以使代码更易于管理和维护，并大大提高代码的可重用性。而在 ECMAScript 2022（ES12）中，新增了一种紧凑模式，能够优化模块导出的方式，提供更好的开发体验。
什么是紧凑模式？
紧凑模式是 ES12 中的一个新增特性，该特性优化了模块导出的方式，使其更加简洁明了。在紧凑模式下，可以通过一行代码实现唯一导出，且不必再像以往一样重复定义导出。
模块唯一导出
在 ES12 中，我们可以使用 export 关键字将模块导出。在紧凑模式下，我们可以使用如下方式定义模块的唯一导出：
export default { ... }其中 { ... } 代表需要导出的内容，可以是一个对象、一个函数或者其它类型的值。这样一来，我们就不必再像以前一样写出下列冗余代码：
const foo = { ... }
export default foo;这样的写法十分冗长，而且会带来代码行数的增多，给代码的阅读和维护都带来不便。而紧凑模式则可以大大简化这种写法，使得代码更加简单明了。
示例代码
下面是一个示例代码，用于说明模块唯一导出的具体用法：
// javascriptcn.com 代码示例
// module1.js
const PI = Math.PI;
export default {
circleArea: r => PI * r * r,
circleLength: r => PI * r * 2,
circumference: r => 2 * PI * r,
};
// module2.js
const source = [1, 2, 3];
export default {
filter: callback => source.filter(callback),
reduce: (callback, initValue) => source.reduce(callback, initValue),
map: callback => source.map(callback),
};
// index.js
import module1 from './module1.js';
import module2 from './module2.js';
console.log(module1.circleArea(1)); // 3.141592653589793
console.log(module2.filter(x => x > 1)); // [2, 3]总结
通过使用紧凑模式，我们可以更加简便地定义和管理模块导出。紧凑模式的唯一导出，使得代码更加简洁明了，能够提高代码的可读性和可维护性。在实际开发中，我们可以运用紧凑模式优化代码，使其更加轻巧简洁。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/6538f3627d4982a6eb221e4b