From what I can tell, an import binding is immutable

import { foo } from './foo';
...
foo.bar = 23; // works 
...
foo = { bar: 23 }; // syntax error

However, I've read elsewhere that JS imports are actually non-writable (not immutable)...in which case wouldn't the first assignment statement, foo.bar = 23; also throw a syntax error?

UPDATE (how I understand it now)

...to paraphrase the excellent answer by @FelixKing...

JS imports are immutable bindings to the exported thing (variable, function, etc).

For non-primitive imports, this does not mean the properties on the imported object are necessarily immutable or non-writable.

From what I can tell, an import binding is immutable

import { foo } from './foo';
...
foo.bar = 23; // works 
...
foo = { bar: 23 }; // syntax error

However, I've read elsewhere that JS imports are actually non-writable (not immutable)...in which case wouldn't the first assignment statement, foo.bar = 23; also throw a syntax error?

UPDATE (how I understand it now)

...to paraphrase the excellent answer by @FelixKing...

JS imports are immutable bindings to the exported thing (variable, function, etc).

For non-primitive imports, this does not mean the properties on the imported object are necessarily immutable or non-writable.

• javascript
• ecmascript-6
• es6-modules

Share Improve this question Follow edited May 23, 2017 at 10:31 CommunityBot 111 silver badge asked Mar 29, 2017 at 13:45 sfletchesfletche 49.8k3131 gold badges109109 silver badges120120 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 9

in which case wouldn't the first assignment statement, foo.bar = 23; also throw a syntax error?

Non-writable refers to the value of the variable, where as mutable (immutable) describes whether the value itself can be changed in place or not.

Imports are not writable as you have found out. But if the value of an import is mutable then you can update the value (in place).

foo.bar = 23;

does not assign a new value to foo. It is reading the value of foo and then modifying it (by adding or overwriting a property). If you did

var oldFoo = foo;
foo.bar = 23;
oldFoo === foo; // true

you would get true. That indicates that foo has still the same value assigned to it. It only updated the value (an object) in place.

All objects are mutable (unless passed to Object.freeze or similar functions), whereas primitive values (String, Number, etc) are all immutable.