What is the difference between ‘let’ and ‘const’ ECMAScript 2015 (ES6)?

by

The difference between let and const is that once you bind a value/object to a variable using const, you can’t reassign to that variable. In other words Example:

const something = {};
something = 10; // Error.

let somethingElse = {};
somethingElse = 1000; // This is fine.

The question details claim that this is a change from ES5 — this is actually a misunderstanding. Using const in a browser that only supports ECMAScript 5 will always throw an error. The const statement did not exist in ECMAScript 5. The behaviour in is either JS Bin being misleading as to what type of JavaScript is being run, or it’s a browser bug.

In practice, browsers didn’t just go from 0% support for ECMAScript 2015 (ECMAScript 6) to 100% in one go — features are added bit-by-bit until the browser is fully compliant. What JS Bin calls ‘JavaScript’ just means whatever ECMAScript features your browser currently supports — it doesn’t mean ‘ES5’ or ‘ES6’ or anything else. Many browsers supported const and let before they fully supported ES6, but some (like Firefox) treated const like let for some time. It is likely that the question asker’s browser supported let and const but did not implement them correctly.

Secondly, tools like Babel and Traceur do not make ES6 ‘run’ in an older browser — they instead turn ES6 code into ES5 that does approximately the same thing. Traceur is likely turning const statements into var statements, but I doubt it is always enforcing that the semantics of a const statement are exactly replicated in ES5. Using JS Bin to run ES6 using Traceur is not going to give exactly the same results as running ES6 in a fully ES6 specification-compliant browser.

It is important to note that const does not make a value or object immutable.

const myArray = [];
myArray.push(1); // Works fine.
myArray[1] = 2; // Also works fine.
console.log(myArray); // [1, 2]
myArray = [1, 2, 3] // This will throw.

Probably the best way to make an object (shallowly) immutable at the moment is to use Object.freeze() on it. However, this only makes the object itself read-only; the values of the object’s properties can still be mutated.

More Related Contents:

  1. Find list of strings that matches a pattern that start with a special character « and end with a special character »
  2. Why are Objects not Iterable in JavaScript?
  3. gulp babel, exports is not defined
  4. How to understand JS realms
  5. Understanding members of Symbol – function constructor
  6. Is it possible to import modules from all files in a directory, using a wildcard?
  7. Why does babel rewrite imported function call to (0, fn)(…)?
  8. Call async/await functions in parallel
  9. How to import jquery using ES6 syntax?
  10. Async function not returning value, but console.log() does: how to do? [duplicate]
  11. Using _ (underscore) variable with arrow functions in ES6/Typescript
  12. When is the body of a Promise executed?
  13. How can I clone a JavaScript object except for one key?
  14. How to convert a plain object into an ES6 Map?
  15. Why are ES6 classes not hoisted?
  16. Can I set the filename of a PDF object displayed in Chrome?
  17. When should I use brackets with imports
  18. es6 import for side effects meaning
  19. Why and how does ([![]]+[][[]])[+!+[]+[+[]]] evaluate to the letter “i”? [duplicate]
  20. What is the difference between importing a function expression or a function declaration from a ES6 module?
  21. Error: How to serialize data from getStaticProps : Next.js
  22. Update one of the objects in array, in an immutable way
  23. Access to Script at ‘ from origin ‘null’ has been blocked by CORS policy
  24. set withCredentials to the new ES6 built-in HTTP request API : Fetch
  25. How does JavaScript import find the module without an extension?
  26. What is ‘global symbol registry’?
  27. Exporting functions with reactjs and babel
  28. object destructuring: how to use intermediate nested property
  29. Compare two Arrays with Objects and create new array with unmatched objects
  30. When is the body of a Promise constructor callback executed?

Leave a Comment