Efter en årrække med WebForms og server kode, ser jeg nu igen mig selv udvikle, mere og mere komplekse løsninger i JavaScript. Med øget kompleksitet, opstår der et behov for øget struktur. JavaScript er dynamisk, og struktur er derfor ikke en selvfølgelighed, som f.eks. i C#. Man er nød til at gøre et arbejde for at strukturere, og det kan ved første øjekast være ret besværligt. Tag f.eks. det faktum at alle funktioner der ikke får specificeret et scope, bliver egenskaber på Window objektet.

Som jeg tidligere har kodet, har jeg lagt alle funktioner / objektkonstruktører i det scope, og med flere og flere kode biblioteker, så vil der ske et kolaps, og man kan ikke regne med hvilken kode der bliver afviklet. Jeg er ikke den eneste der har oplevet dette – f.eks. har jeg observeret at en meget kendt .NET applikation, tidligere havde en global funktion, der, som jeg husker det, så nogenlunde sådan ud:

function $(id){
    return document.getElementByID(id);
}

// Bruges således:

$("myDiv").innerText = “Hello world”;

Smart ikke? Men pludselig kom et kendt JavaScript API på banen og blev standard: jQuery, og så virkede det ikke efter hensigten længere.

Med andre ord, så vil der blive større og større behov for at scope sin kode – Namespacing. Hvordan gør man så lige det i JavaScript?

Man kan gøre det på flere måder, men jeg foretrækker at konstruerer mit namespace objekt direkte i en selvinitialicerende funktion:

var ICoder = function(){
    return {
        funk1 : function(){ alert("Hello funk1"); },
        funk2 : function(){ alert("Hello funk2"); }
    };
}();

// Brug:
ICoder.funk1();

Ud over at den fremgangsmåde er kompakt, så giver den også et par sidegevinster. Da namespacet er en funktion, kan man erklære private variabler (funktioner og properties), ved at udnytte closure:

var ICoder2 = function(){
    // Private medlemmer:
    var secretValue = "The answer is 42!";
    
    // Public medlemmer:
    return {
        getTheAnswer : function(){
            alert(secretValue);
        }
    };    

}();

// Brug:
ICoder2.getTheAnswer();

// Følgende virker ikke:
alert(ICoder2.secretValue);

Yeps – private members i JavaScript – Det er næsten helt OOP.

Code on…