在 ES9 中正确使用 import() 动态加载模块
ES9（ECMAScript2018）中引入了 import() 方法，使得动态加载模块成为可能。这个方法返回一个 Promise 对象，使得可以异步加载模块，而不需要在代码加载时全部加载。这对于前端的性能和灵活性都是非常有帮助的。
从语法上讲，import() 的用法与静态 import 类似，只是最后得到的不是一个值，而是一个 Promise 对象。因此，需要使用 async/await 或者是 .then() 等方式来处理异步加载的结果。
值得注意的是，import() 的粒度是模块级别，而不是导出/引入的类或者函数级别。这意味着不能直接动态地加载某个函数或者类，而需要加载整个模块。当然，这也可以通过默认导出或者命名导出的方式来达到同样的目的。
下面是一个使用 import() 加载模块的示例代码：
----- -------- ---------------------- - ----- ------ - ----- ---------------------------------- ------ --- ----------------- -- ---------- - -- ------- ----- -------- - ----- ----------------------- -----------------------
上面一段代码假设模块都存储在 modules 目录下，且模块有一个默认导出的接口。这个接口可以是一个类的实例，也可以是一个工厂函数等。
提示： 使用import()的时候要注意，因为import()是异步的，所以建议放入异步函数中异步处理，另外在代码写法上建议防止混乱，结构清晰。
总结而言，在 ES9 中使用 import() 动态加载模块，需要注意以下几点：
- import() 是异步的，需要使用 async/await 或者 .then() 等方式来处理加载结果。
- import() 的粒度是模块级别，需要加载整个模块，但可以通过导出默认导出或者命名导出的方式，实现对类或者函数级别的动态加载。
- 在代码中要注意结构清晰，使用异步函数处理异步操作。
以上只是引入了 import() 动态加载模块的方法以及一些注意事项和示例代码，大家可以根据需求合理运用。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/664a9ca7d3423812e49892b1