随着前端技术的不断发展，JavaScript 的语言生态也在不断地壮大。而其中一项重要的功能就是模块化编程，它可以大幅提高代码的复用，提高开发效率，方便项目的维护和升级。
在 ES6 中，我们已经见识到了 import 和 export 两个关键字，使得我们可以轻松地将模块进行导入和导出。而在 ES12 中，我们有了一个新的导出方式——export * as namespace。
什么是 export * as namespace？
export * as namespace 是一种新的导出方式，它可以一次性地将所有导出的变量、函数、类等打包成一个命名空间。这与其他语言中常见的命名空间概念类似，可以减少命名冲突，提高代码的可读性和可维护性。
如何使用 export * as namespace？
export * as namespace 的使用非常简单，我们只需要在导出的模块中使用这个关键字即可。例如，我们要将一个模块的所有导出打包成一个 Utils 命名空间，可以这样写：
-- -------------------- ---- ------- -- -------- ------ -------- ------ -- - ------ - - -- - ------ -------- ----------- -- - ------ - - -- - ------ -------- ----------- -- - ------ - - -- - ------ - -- ----- ---- ----------
这样，我们就在 utils.js 中将所有导出打包成了一个 Utils 命名空间，其它模块就可以很方便地引用它：
// main.js
import { Utils } from './utils';
console.log(Utils.add(1, 2)); // 输出 3
console.log(Utils.subtract(5, 3)); // 输出 2
console.log(Utils.multiply(2, 3)); // 输出 6export * as namespace 的指导意义
使用 export * as namespace 可以减少全局命名空间的污染，提高代码的可维护性。此外，在打包代码时，我们也可以借助工具对所有导出的模块进行统一的命名空间处理，从而进行更好的压缩和优化。
示例代码
下面是一个完整的使用 export * as namespace 的示例代码：
-- -------------------- ---- ------- -- -------- ------ -------- ------ -- - ------ - - -- - ------ -------- ----------- -- - ------ - - -- - ------ -------- ----------- -- - ------ - - -- - ------ - -- ----- ---- ----------
// main.js
import { Utils } from './utils';
console.log(Utils.add(1, 2)); // 输出 3
console.log(Utils.subtract(5, 3)); // 输出 2
console.log(Utils.multiply(2, 3)); // 输出 6总结
export * as namespace 是 ES12 中一个非常实用的语法，可以让我们轻松地将所有导出打包成一个命名空间，减少命名冲突，提高代码可读性和可维护性。当然，在使用时我们也需要注意合理使用命名空间，避免出现过于复杂的命名空间结构。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/645b8013968c7c53b0dcf723