ES6 variable import by reference or copy

Question

Suppose i have a var.js

export let x = 1;
export const f = () => x = 5;

Then i execute this in another file

import { x, f } from './var.js';
console.log(x); // 1
f();
console.log(x); // 5

Why is the imported variable x able to change accordingly?

Does import { x } gets re-evaluated when x in var.js changes?

Or is x a reference to the original x in var.js rather than a copy?

Also check this : https://stackoverflow.com/questions/32558514/javascript-es6-export-const-vs-export-let — GramThanos, Oct 25 '17 at 16:29
ES2015 modules export (live) bindings, not values. Read this [Q&A](https://stackoverflow.com/q/39259729) about the differences between bindings and references. — , Oct 25 '17 at 16:34

score 15 · Accepted Answer · answered Oct 25 '17 at 16:28

15

ES6 import/exports are actually bindings (references). As the value of x in original file var.js changes, it's reflected in another file too.

answered Oct 25 '17 at 16:28

Theogry

FWIW, the term "binding" is used to for every variable/parameter, etc . It's not only used for imports. – Felix Kling Oct 25 '17 at 16:30
Thanks for info, willing to extend a bit on where it's used? – Theogry Oct 25 '17 at 16:33
Any entry in an environment (scope) is a binding: https://ecma-international.org/ecma-262/8.0/#sec-environment-records – Felix Kling Oct 25 '17 at 16:35
3

Seems like it only works if you do `export let x`, but not `export default x`? – Avery235 Oct 25 '17 at 17:04
I am not aware of the difference between this two in terms of your problem. May you elaborate? – Theogry Oct 25 '17 at 17:08

zavr · Answer 2 · 2020-02-28T09:33:14.247

3

solution doesn't work for functions

export let e = () => {
  console.log('b')
}

window.b = () => {
  e = () => {
    console.log('c')
  }
}

the when calling from another file, the "reference" doesn't change.

import { e } from './test'
e() // b
b()
e() // still b

edited Feb 28 '20 at 09:33

answered Feb 28 '20 at 09:18

zavr

2 Answers2