Javascript: final / immutable global variables?

Question

I think I know the answer but... is there any way to prevent a global variable from being modified by later-executing <script>? I know global variables are bad in the first place, but when necessary, is there a way to make it "final" or "immutable"? Hacks / creative solutions are welcome. Thanks

Answer 1

the const keyword?

Answer 2

I know this question is old, but you could use Object.freeze(yourGlobalObjectHere); I just wrote a blog post about it here.

Answer 3

You can use closure technique, MYGLOBALS is an object that has a function called getValue against the "globals" associative array that is out of scope for everything except MYGLOBALS instance.

var MYGLOBALS = function() {
    var globals = {
        foo : "bar",
        batz : "blah"       
    }
    return { getValue : function(s) {
            return globals[s];
        }
    }
}();
alert(MYGLOBALS.getValue("foo"));  // returns "bar"
alert(MYGLOBALS.getValue("notthere")); // returns undefined
MYGLOBALS.globals["batz"] = 'hardeehar'; // this will throw an exception as it should

Answer 4

yes the const is short for constant or final in some languages. google "javascript variable const" or constant to double i have even tested it myself so

const yourVar = 'your value';

thats what you are looking for.

Answer 5

Object.defineProperty(window, 'CONSTANT_NAME', {value: CONSTANT_VALUE});

// usage
console.log(CONSTANT_NAME);

Object.defineProperty() creates a property with the following default attributes:

• configurable true if and only if the type of this property descriptor may be changed and if the property may be deleted from the corresponding object. Defaults to false.

• enumerable true if and only if this property shows up during enumeration of the properties on the corresponding object. Defaults to false.

• writable true if and only if the value associated with the property may be changed with an assignment operator. Defaults to false.

if the "constant" is an object you might additionally want to make it immutable by freezing it. obj =Object.freeze(obj). have in mind that child-property-objects are not automatically frozen.

Answer 6

This would be much cleaner approach

   var CONSTANTS = function() {
        var constants = { } ; //Initialize Global Space Here
        return {
            defineConstant: function(name,value)
            {
                if(constants[name])
                {
                   throw "Redeclaration of constant Not Allowed";
                }
            },
            getValue(name)
            {
               return constants[name];
            }
        } ;
    }() ;
    CONSTANTS.defineConstant('FOO','bar') ;
    console.log(CONSTANTS.getValue('FOO')) ; //Returns bar
    CONSTANTS.defineConstant('FOO','xyz') ; // throws exception as constant already defined
    CONSTANTS.getValue('XYZ') ; //returns undefined

Answer 7

try this:

const whatEver = 'Hello World!!!';

function foo(value){
 whatEver = value;
}

then you would call it like so...

<div onclick="foo('New Value');">Change Me First</div>
<div onclick="alert(whatEver);">Then click me After: Should Be alert "Hello World!!!"</div>

Answer 8

what about this code by http://ejohn.org/ @ http://ejohn.org/blog/ecmascript-5-objects-and-properties/

Look like this actually works... I run some "little" testing and freeze the variables and attributes.

Freezing an object is the ultimate form of lock-down. Once an object has been frozen it cannot be unfrozen – nor can it be tampered in any manner. This is the best way to make sure that your objects will stay exactly as you left them, indefinitely.

Object.freeze = function( obj ) {
  var props = Object.getOwnPropertyNames( obj );

  for ( var i = 0; i < props.length; i++ ) {
    var desc = Object.getOwnPropertyDescriptor( obj, props[i] );

    if ( "value" in desc ) {
      desc.writable = false;
    }

    desc.configurable = false;
    Object.defineProperty( obj, props[i], desc );
  }

  return Object.preventExtensions( obj );
};

Little example

var config = (function (__name) {
    name: __name
    var _local = {
        Server: "SomeText",
        ServerDate: "SomeServerDate",
        JSDate : Util.today(),
        User : {
            user: "1stUser",
            name: "",
            email: ""
        },        
    }

    /*Private Methods*/
    function freezing(__array) {
        $.each(__array, function (_index, _item) {
            Object.freeze(_item);
        });
    }

    /*Public Methods*/
    var $r = {};

    $r.info = function () {
        return _local;
    }

    freezing([
        _local,
        _local.User
    ]);


    _local.User.user = "newUser"; //Trying to assing new value

    //Remain with the same value as first declaration
    console.log(_local.User.user); //--> "1stUser"           
    return $r;
})("config");

Answer 9

Choose a variable name which is unlikely to be overwritten by accident and trust the programmer to not do stupid things. JavaScript is not Java, so don't pretend it was.

Also, if what you really want to do is namespacing, use a self-executing function literal:

var myLibName = (function() {
    var aPrivateVar;

    function aPrivateFunction() {}

    function accessorForPrivateVar() {
        return aPrivateVar;
    }

    // public interface:
    return {
        getPrivateVar : accessorForPrivateVar
    }
})();

Answer 10

Instead of declaring all such variables in the global scope, you could have one global object wrapping around those variables. Using Object.defineProperty() and/or Object.defineProperties() with the writable flag set to false, you can have an immutable variable.

var myObj = {};

Object.defineProperty(myObj, 'myVar', {
    value: someValue,
    writable: false
});

Or you could just use the const keyword

const MY_VAR = 10;

Answer 11

Conventions and good Documentation.

You can prefix your "immutable" variable with two (or more) underscores to indicate that is something not meant to be used by others and to avoid other people's variables clashing with yours.

Maybe creating a 'namespace' like __GLOBALNAMESPACE (Ugly name, I know) and then adding your variables into it (eg __GLOBALNAMESPACE.my_var) and creating a method like this one to retrieve them:

getVariable(string name){
  return __GLOBALNAMESPACE[name]
}

Just my 2 cents.

Answer 12

If you can use typescript, you can mark properties as readonly

Answer 13

You might want to try out this jquery plugin. It prevents you to create global objects in javascript :)

example code

Store data

// 'val' can be a string, integer, hash table, array, object
$.secret( 'in', 'secretName', val );

// or a function
$.secret( 'in', 'secretName', function( arg1, arg2, arg3 ){
  // do something here
});

Use data; you can even use it in different files.

var lang = $.secret( 'out', 'lang' );

Call out a function

$.secret( 'call', 'secretName', [ arg1, arg2, arg3 ]);
// or
$.secret( 'call', 'secretName', arg );

Clear data

$.secret( 'clear', 'lang' );

source code is on github

Answer 14

The following example code makes a globally available variable immutable

Object.defineProperty(window, `env`, {
    value: Object.freeze({
        API: "https://api.mywebsite.com",
    }),
});

And it can be referenced from either window.env or just env.

Answer 15

Javascript is object oriented, rather than making the variable $public static, consider making it private and then properly providing an acessor method for getting, but not setting it.

e.g.

private var myGlobal : myType;
function GetMyGlobal() : myType
{
return myGlobal;
}

There are ten different ways to solve any given problem, your way and the right way.