Czym są domknięcia (closures) w JavaScript?

Domknięcia to jeden z podstawowych mechanizmów działania JavaScript. Zobacz czym są domknięcia.

Termin ten pojawia się często na rozmowach rekrutacyjnych gdzie wymagana jest znajomość JavaScript. Warto więc zapoznać się z tym zagadnieniem.

Domknięcia (closures) w JavaScript

Podstawą domknięć w JavaScript jest zasięg leksykalny. Tak naprawdę nie musimy wiedzieć czym są domknięcia, aby pisać skrypty. Znajomość tego terminu pomoże jednak zrozumieć jak działa JavaScript, co z kolei może przełożyć się na jakość naszego kodu.

function test() {
    const name = 'devpebe';

    function displayName() {
        return name;
    }

    return displayName;
}

const getName = test();
console.log(getName()); // devpebe

W powyższym kodzie nie pojawia się nic nowego, jeśli zna się podstawy JavaScript.

Gdzie jest domknięcie?

Otóż funkcja displayName nie posiada zdefiniowanej zmiennej name, więc zgodnie z zasadą działania zasięgu leksykalnego szuka jej w zasięgu funkcji test. Następnie funkcja test zwraca displayName. Jeśli wywołamy getName to kod zwróci „devpebe„.

Oznacza to, że displayName posiada dostęp do zmiennej name pomimo, że została wywołana poza funkcją test. displayName pamięta środowisko, w którym zostało wykonane. To właśnie nazywamy domknięciem.

Inne źródła na temat domknięć

Pamiętam, że na początku nie potrafiłem tego zrozumieć, dlatego polecę kilka innych materiałów.

Closures od Overment

Closures na MDN

A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function’s scope from an inner function. In JavaScript, closures are created every time a function is created, at function creation time.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures

Zobacz więcej na temat domknięć na MDN

Kyle Simpson – Closures (dostęp płatny)

Jeżeli macie dostęp do platformy Pluralsight to polecam materiały od Kyle Simpsona. Bardzo dobrze tłumaczy na czym polegają domknięcia. W kursie omawia również inne tematy takie jak: Scope, Object Orienting, Async Patterns.

Zobacz kurs „Advanced JavaSript” Kyle Simpsona.