Javascript closures uitgelegd – deel II

Dit is deel twee van de uitleg over Javascript closures. Mocht je deel I nog niet gelezen hebben, lees dan eerst het eerste deel. In dit artikel gaan we namelijk verder waar we gebleven waren in het vorige artikel.

De counters een naam geven

Het bericht wat in het vorige voorbeeld werd getoond is voor elke counter hetzelfde. Dit is natuurlijk niet handig als je veel counters moet bijhouden. Dit kunnen we als volgt oplossen:

Bovenstaande code kan als volgt worden aangeroepen:

Het voordeel aan closures is dat deze niet alleen intern variable kunnen bijhouden, maar ze onthouden ook met welke waardes ze zijn aangeroepen. Dit hoef je dus maar één keer mee te sturen.

De aanroep verbeteren

De manier waarop de functie increment wordt aangeroepen kan ook nog verbeterd worden. Het is nu namelijk niet mogelijk om een andere functie aan te roepen. Daarom moeten eerst de createCounter functie worden aangepast zodat deze niet altijd de increment-functie aanroept.

Dit doen we als volgt:

In de createCounter-functie geven we nu alle functies terug die de closure bevat. We geven hiermee aan welke functies de closure allemaal bevat en kunnen worden aangeroepen.

De createCounter-functie kunne we dan als volgt gaan gebruiken:

De createCounter functie uitbreiden met een verlaag functie

Nu we weten hoe we functies in die in de closure staan kunnen teruggeven, is het heel eenvoudig om deze uit te breiden met een functie om de counter te verlagen.

Zoals te zien is in bovenstaand is het alleen nodig om de functie decrement toe te voegen aan de closure en aan het return object. Daarna werd de nieuwe functie op dezelfde manier als onze bestaande functie.

Closures nog verder uitgelegd

In het volgende deel gaan we nog dieper in op het gebruik van closures. Zo leggen we uit hoe je functies kunt verstoppen in een closure en hoe je abstracte datatypes kunt gebruiken.