JS - closure + literał

Ciekawy kod, jaki znalazłem w internecie zawierający domknięcie oraz literał obiektu. Zobaczmy, jak to działa. Do dzieła!

Oto kod:

function createCounter(){
    let num = 0;

    return {
        get() {
            return num;
        },
        increment(){
            return ++num;
        },
        decrement(){
            return --num;
        }

    }
}

let counter1 = createCounter();
counter1.increment();
counter1.increment();
counter1.increment();
console.log(counter1.get()); //3

To samo moglibyśmy osiągnąć w ten sposób:

function createCounter(){

    return {
        num: 0,
        get() {
            return this.num;
        },
        increment(){
            return ++this.num;
        },
        decrement(){
            return --this.num;
        }

    }
}

Czy jest w ogóle jakaś różnica? Pomyślmy. Intuicja może nam podpowiadać, że w pierwszym przypadku mamy do czynienia ze zmienną statyczną i wszystkie countery będą miały ten sam num.

I intuicja będzie nam źle podpowiadać, literał obiektu to nie klasa. Oto dowód:

function createCounter(){
    let num = 0;

    return {
        get() {
            return num;
        },
        increment(){
            return ++num;
        },
        decrement(){
            return --num;
        }

    }
}

let counter1 = createCounter();

counter1.increment();
counter1.increment();
counter1.increment();

console.log(counter1.get()); //3

let counter2 = createCounter();

console.log(counter2.get()); //0
console.log(counter1.get()); //3

Jak widać mamy tu do czynienia z typowym dla obiektówki innych języków polem instancji a nie polem statycznym klasy. Jakiej klasy, nie ma żadnej klasy. Natomiast obiekt ma dostęp do zmiennej poprzez domknięcie, tak jak to mamy w funkcjach wyższego rzędu.

Dziwne, ale kod ładny.

JS – closure + literał