Praktiskt exempel av closure-funktion

Jag har stött på en honest-to-god användbar funktion som använder sig av closure och något som kallas currying. Jag påstår inte att jag förstår teorin bakom, men när det gäller klientsidevalidering i JavaScript hittade jag en användning för det.
Det kan ibland vara nödvändigt att validera formulär på klientsidan med hjälp av JavaScript, och det kan vara värt att skriva ett generellt valideringsobjekt med funktioner som man använder sig av, istället för att skriva omständliga valideringsregler per inputfält.
validation-objektet bör vara del av något större, med vettiga closures. Det här är bara ett exempel.

window.validaton = {
     //Returnerar olika funktioner beroende på om max är satt
    length: function(min, max){
        return function(input){
            if (max) {
                return function(input) {
                    if ($(input).val().length < min || $(input).val().length > max) {
                        return false;
                    }
                    return true;
                }
            }
            return function(input) {
                if ($(input).val().length < min) {
                    return false;
                }
                return true;
            }
        }
    }
}

Det här är praktiskt sett en funktionsgenerator. När man skriver sina valideringsregler för inputfält kan det se ut såhär:

//Skapar en ny funktion för att se så värdet är längre än 5 men annars hur långt som helst.
var isLongEnough = validation.length(5); 

if (isLongEnough("#AwesomeTextInput")) { //Är man inne i en bind-funktion räcker det med this här
    log("Everything went better than expected");
} else {
   log("Needs atleast 5 characters");
}

//Alternativt
 //Anonym funktion skapas och anropas, inte reusable

if (validation.length(5)("#AwesomeTextInput")) {
    log("Everything went better than expected");
} else {
   log("Needs atleast 5 characters");
}

Tack vare closures och svart magi vet den returnerade funktionen isLongEnough vad min är satt till.
Enligt mig är det här ett snyggare sätt än att skriva specialanpassade valideringsregler för varje inputfält, plus att man får användning av currying och closures, vilket alltid är trevligt.

  1. asdfg Reply

    dåligt med kommentaer här, lite synd.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>