ES6 Modules

Question 1

What is value of ‘this’ at top level of a module?

Answer 1

undefined (as opposed to window, which it would be if not in a module)

Question 2

Name 3 ways modules semantics are different than script semantics.

Answer 2

module code automatically runs in strict mode; value of ‘this’ is undefined; variables at top level don’t automatically modify the global scope; modules must export anything that should be available to code outside module.

Question 3

How many times will example.js be executed in the following:
import { sum } from ‘./example.js’;
import { subtract } from ‘./example.js’;

Answer 3

Once. After the code to import the module executes in first import, it’s kept in memory and reused.

Question 4

Can modules be imported conditionally, as in:

if (flag) { import ‘.somefile.js’ }

Answer 4

No. Both import and export must be used outside other statements or functions.

Question 5

Export function sum(x,y){…} using a name other than sum, e.g. ‘add’

Answer 5

export { sum as add }

Question 6

What are two ways to export a module using the ‘default’ keyword?

Answer 6

1. export default myFunc( arg ){…}

2. or name the variable, function, or class first, then export it, export default myFunc;

Question 7

How do you load a module in a web page?

Answer 7

script type=”module” src=”module1.js” (then close script tag)

Question 8

what order will following modules execute?
script type=”module” src=”mod1.js” /
script type=”module” src=”mod2.js” /
script type=”module” async src=”mod3.js” /

Answer 8

mod1 will execute before mod2, but mod3 is async and will execute as soon as it’s parsed, so we can’t know whether it will go before or after the others.