Javascript Closures & Memoization

Ein Überblick über Closures in Javascript. Optimiere deinen Code und Performance mit dem Memoization Entwurfsmuster.

Closures sind Funktion höherer Ordnung

Eine Funktion der höherer Ordnung liefert eine andere Funktion als Rückgabewert zurück. Das besondere dabei ist, dass die zurückgegebene Funktion auf die Parameter und Variablen der äußeren Funktion zugreifen kann.

/**
 * Eine typische closure Funktion
 */
var closures = function(arg)
{
 
    var number = 0;
 
    return function()
    {
        number++;
        console.log( arg + ": " + number );
    }
}
 
var increment1 = closures("increment1");
increment1(); // increment1: 1
increment1(); // increment1: 2
increment1(); // increment1: 3
 
var increment2 = closures("increment2");
increment2(); // increment2: 1
increment2(); // increment2: 2
increment2(); // increment2: 3

Memoization Entwurfsmuster

Bei Performance -lastigen Funktionen können wir mit dem Memoization Entwurfsmuster ein Caching Mechanismus einbauen. Damit können wir bereits berechneten Werte aus dem Cache laden statt diese neue zu berechnen.

/**
 * Eine Closure Funktion mit Memoization Entwurfsmuster
 */
var memoization = function()
{
    var cache = {};
 
    return function(n)
    {
        // wenn n nicht im cache ist
        // sollte der Wert berechnet werden.
        // wenn n im cache ist sollte der wert aus
        // dem cache objekt geladen werden.
        if( cache[n] === undefined )
        {
                     
            console.log("### "+ n +" wurde gecached ###");
            cache[n] = sqrt(n);
 
        }
 
        return cache[n];
 
    }
     
}
 
function sqrt(n)
{
    return Math.sqrt(n);
}
 
var memo = memoization();
memo(12); // berechnet
memo(36); // berechnet
memo(36); // aus dem cache geladen
memo(12); // aus dem cache geladen
Zurück