Does importing javascript modules only run them once?

user_1203580 0
Viewed 760

If I import a module A inside both module B and C, is the code inside A executed 2 times in total? That means if I call fetch() inside A, will fetch() be called 2 times?

e.g.

//file: A.js
var A = {
  init: false,
  count: 0
};

if(A.init == false) {
  A.init = true;
  A.value = fetch("https://...");
}

I thought module codes are only executed once for the lifetime of the webpage no matter how many times they are imported?

So if inside module B I set A.count = 1, then inside module C, the value of A.count is also 1.

But according to "Import a module for its side effects only" at:

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import

I can run a module A code multiple times for each module (B, C, D) that uses it. How does this commensurate with the above?

es6-modules javascript
1 Answers

The code from Module A will be executed 2 times! Once in Module B and again in Module C.

Module A

function foo() {
  return 'yo I`m in module A being executed in... ';
}

export default foo;

Module B

import foo from './moduleA';

console.log(`${foo()} in module B`);

Module C

import foo from './moduleA';

console.log(`${foo()} in module C`);
user_31806380
Related