1,339 reads

Once Upon a Time in Javascript: The const Keyword

by SashaJanuary 2nd, 2020

Too Long; Didn't Read

Const was introduced in 2015 as part of ECMAScript 6 standard back in 2015. It is block-scoped but is used to define a constant value (obv) The fact that it is constant doesn't mean it is immutable, but a value its self remains mutable. If you want to create a completely immutable value you should use Object.freeze() before ES6. You can also use functions that always return the same value:.iateiate().iate() or create a "repository" using "immediately-invoked function expressions" (IIFE)

Coin Mentioned

featured image - Once Upon a Time in Javascript: The const Keyword

const

keyword was first introduced in javascript as part of ECMAScript 6 standard back in 2015. It probably the most popular way of declaring a variable in javascript, but how was javascript before them?

Hi rocks, Sasha here. Today we gonna see some alternatives to

const

keyword in javascript before ES6.

const

As mentioned above,

const

was introduced in 2015 as part of the ES6 standard. const value is block-scoped like

let

but is used to define a constant value (obv).

Mutability

The fact that it is constant doesn't mean it is immutable. It's a common misconception, but

any const object can change its properties

, such as

any const array can change its data

. Let me show you some examples:

//const object example
//declare a const object with id and msg
const a = {
    id: 5,
    msg: "Hello!"
}

//change property of constant object
a.msg = "Hi!";//c changes it's value
//reasign constant object
a = { msg: "new object!" };//TypeError: Assignment to constant variable.

//const array example
//declare const array
const arr = [ "Hello", "Constant" ];
//push new element to array
arr.push("works");          //push new element - ok
//change first element in array
arr[0] = "Hi!";             //change first element - ok
//reasign to new array
arr = [ "New", "Array" ];   //change reference - TypeError: Assignment to constant variable.

//primitive const value
//declare consatnt string
const message = "Constant string";
message = "New constant string";//change value - TypeError: Assignment to constant variable.

To sum up:

const

creates an immutable pointer to a value, but a value its self remains mutable. If you want to create a completely immutable value you should use Object.freeze().

const before ES6

So, how do you declare a constant value using standards previous to ES6?

You don't

. Yeah. It was a good practice to declare a variable using an

ALL_CAPS

writing so that everyone knows it shouldn't be changed. Another way was to create a "repository" using "immediately-invoked function expressions" (IIFE). All the data declared inside IIFE are not visible neither changeable outside its scope. So you had to do something like this:

//declare constant values names
var ONE = "ONE";
var TWO = "TWO";
//create a repositpory for them
var ConstValues = (function() {
    //(function(){})() creates a scoped function.
    //only get method is visible from outside, so no one can
    //change data
    var data = {};
    
    //create two constant values
    data[ONE] = "uno";
    data[TWO] = "due";

    //everything inside return will be visible outside
    return {
       get: function(name) { return data[name]; }
   };
})();

//get constant value
var two = ConstValues.get(TWO);//due
//change constant value
ConstValues.data[TWO] = "dos";//TypeError: Cannot set property 'TWO' of undefined
//ConstValue.data is not visible here! (so you cannot change its properties)

Charming, yeah.

You can also use functions that always return the same value:

//declare constant values as function
function CONST_VALUE(){
    return "constant_value";
}

CONST_VALUE();//"constant_value"

//function to create a function that returns a constant value
function constant(value){
    return function(){
        return value;
    }
}

var a = constant(5);
a();//5