Estoy tratando de comprender el núcleo de los conceptos js, y traté de escribir un cierre.
function counter(){ let counter = 0; return{ increment: () => counter++, getCounter: counter } } const addCounter = counter(); addCounter.increment(); addCounter.increment(); addCounter.increment(); addCounter.increment(); addCounter.increment(); console.log(addCounter.getCounter) el resultado aquí es 0 si cambio getCounter: counter a getCounter:()=>counter y llamaré nuevamente con addCounter.getCounter() la respuesta es correcta y será 5 . ¿alguien puede explicarme por qué?
Cuando se devuelve el objeto, el contenido aquí se evalúa como una expresión:
{ increment: () => counter++, getCounter: counter } En ese momento, el counter es 0, por lo que es equivalente a
{ increment: () => counter++, getCounter: 0 } El counter , aunque actualizado por la función de increment , no se vuelve a referenciar después de que se devuelve el objeto (estático).
Debe hacer que getCounter sea una función o captador, de modo que devuelva el valor actual dentro del cierre.
function counter(){ let counter = 0; return{ increment: () => counter++, get getCounter() { return counter; } } } const addCounter = counter(); addCounter.increment(); addCounter.increment(); addCounter.increment(); addCounter.increment(); addCounter.increment(); console.log(addCounter.getCounter)