Question

I have a “host” javascript closure, in which i keep all the common variables i am using over the website

var hostFunction = (function () {
    var variableA = $("#variableA");
    var variableB = $("#variableB");

    // some usefull code here
} ());

In my website, in another javascript file, i have another closure

var childFunction = (function () {
    var changeValue = function () {
        variableA.html("I was changed");
    };

    // other usefull code
} ());

How is possible to insert “childFunction” inside “hostFunction” so i can get access to those variables?

What is the best practice of sharing variables across the website but also keeping them inside a scope so they don’t conflict with other javascript variables?

Answer 1

I think you need the word this for those variables to be seen in other scopes

var hostFunction = (function () {
    this.variableA = $("#variableA");
    this.variableB = $("#variableB");

    // some usefull code here
} ());

You pass in your host in the constructor of your childFunction like this:

var childFunction = (function (myHost) {
    var changeValue = function () {
        myHost.variableA.html("I was changed");
    };

    // other usefull code
} (hostFunction));