Classic scripts v/s module scripts in Javascript

Question

I was going through the WHATWG specs for async and defer attributes for the

Answer 1

Here are the differences I have noted from various articles. If you want more details, read a complete article on the web:

1. Modules are singleton. They will be loaded and executed only once.
2. Modules can use import and export.
3. Modules are always executed in strict mode.
4. All objects (class, const, function, let or var) are private unless explicitly exported.
5. The value of "this" is undefined at the outer scope (not window).
6. Modules are loaded asynchronously.
7. Modules are loaded using CORS. see Access-Control-Allow-Origin: *.
8. Modules don't send cookies and authentication info by default. See crossorigin="use-credentials".
9. imports are resolved statically at load time rather than dynamically at runtime.
10. html comments are not allowed.

Answer 2

A classic script is just a standard JavaScript script as you know it. A module script is one that contains an ES6 module, i.e. it uses (or: can use) import and export declarations.

From §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.

Also have a look at https://blog.whatwg.org/js-modules.