Javascript closures uitgelegd – deel II

Geschreven door: op maandag 18 april 2016

Leestijd:

Dit is deel twee van de uitleg over Javascript closures. Mocht je deel I nog niet gelezen hebben, lees deze dan eerst hier door. 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:

javascript closures 6

Bovenstaande code kan als volgt worden aangeroepen:

javascript closures 7

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:

javascript closures 8

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:

javascript closures 9

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.

javascript closures 10

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.


Andere blogartikelen

  • Waarom developers het zo leuk vinden bij ons

    Geschreven door: op woensdag 13 november 2019

    Bij ons op kantoor werkt een team van betrokken specialisten, waaronder 4 backend developers en 4 UX developers. Zij zorgen voor een belangrijk fundament binnen dit bedrijf. Een goede reden om te zorg ...

    Bekijk het artikel »
  • Beachvolleyballen voor het goede doel!

    Geschreven door: op vrijdag 25 oktober 2019

    Afgelopen vrijdag 11 oktober  hebben diverse betrokken specialisten uit ons team de handen ineen geslagen met een van onze opdrachtgevers. Samen met De Monchy International B.V. hebben we meegeda ...

    Bekijk het artikel »
  • Het gebruik van een Photoslider

    Geschreven door: op maandag 7 oktober 2019

    Ze zijn er in alle soorten en maten en staan meestal bovenaan een websitepagina. Dan heb ik het natuurlijk over photosliders. Zo bent u vast bekend met de traditionele foto die langzaam vervaagd en wa ...

    Bekijk het artikel »
Bel 072 5345 888
Onze Middelen en Technologieën
microsoft silver partner
Adobe partner
fd-gazellen-2018.jpg
Google analytics
partners-logo.jpg
Op de hoogte blijven?

Meld u aan voor de gratis nieuwsbrief om op de hoogte te blijven van onze activiteiten