JavaScript 中的经典脚本与模块脚本

Question

我正在查看 async 的 WHATWG 规范和 <script> 标签的 defer 属性，当我看到以下语句时：

Classic scripts may specify defer or async; module scripts may specify async.

我查看了 classic 和 module 脚本的 WHATWG 定义，但我并没有真正弄清楚。简单来说，classic和JavaScript中的module脚本有什么区别？

Answer 1

经典脚本 只是您所知道的标准JavaScript 脚本。 模块脚本是包含ES6 module的脚本，即它使用（或：可以使用）import和export声明。

来自 §8.1.3.8 Integration with the JavaScript module system:

The JavaScript specification defines a syntax for modules, as well as some host-agnostic parts of their processing model. This specification defines the rest of their processing model: how the module system is bootstrapped, via the script element with type attribute set to "module", and how modules are fetched, resolved, and executed. [JAVASCRIPT]

Note: Although the JavaScript specification speaks in terms of "scripts" versus "modules", in general this specification speaks in terms of classic scripts versus module scripts, since both of them use the script element.

另请参阅 https://blog.whatwg.org/js-modules。

Answer 2

以下是我从各种文章中注意到的差异。如果您想了解更多详细信息，请阅读网络上的完整文章：

1. 模块是单例的。它们只会被加载和执行一次。
2. 模块可以使用导入和导出。
3. 模块总是在严格模式下执行。
4. 除非显式导出，否则所有对象（class、const、function、let 或 var）都是私有的。
5. "this" 的值在外部范围内未定义（不是 window）。
6. 模块是异步加载的。
7. 使用 CORS 加载模块。请参阅访问控制允许来源：*.
8. 默认情况下，模块不发送 cookie 和身份验证信息。参见 crossorigin="use-credentials".
9. 导入在加载时静态解析，而不是在运行时动态解析。
10. html 不允许评论。