Een closure is een functie gebundeld met verwijzingen naar variabelen uit zijn omringende (lexicale) scope. Door closures behoudt een binnenste functie toegang tot de variabelen van zijn buitenste functie zelfs nadat de buitenste functie is teruggekeerd.
() {
count = ;
{
: ++count,
: count,
};
}
a = ();
b = ();
a.(); a.();
b.();
count is niet van buitenaf toegankelijk — alleen inc/get kunnen het zien. Dat is data privacy opgebouwd uit een closure. En elk aanroepen van makeCounter() creëert een nieuw, geïsoleerd bereik.
for (var i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 0); // prints 3, 3, 3 — all share one `i`
}
for (let i = 0; i < 3; i++) {
setTimeout(() => console.log(i), 0); // prints 0, 1, 2 — `let` is per-iteration
}
Met var sluit elke callback over dezelfde i (die 3 is wanneer ze worden uitgevoerd). let creëert een nieuwe binding bij elke iteratie.
Closures geven kracht aan module privacy, memoization, currying, event handlers/callbacks die state onthouden, en zijn precies hoe React hooks (useState) waarden tussen renders behouden.