Не получается понять замыкание в JS [дубликат]

169

06 февраля 2020, 00:00

На этот вопрос уже даны ответы здесь:

Как работают замыкания в JavaScript (7 ответов)

Закрыт 10 месяцев назад.

Самые популярный пример с замыканием - это счетчик:

var counter = (function() { 
  var current = 0; 
  return function() { 
    current++; 
    return current; 
  } 
})(); 
 
console.log(counter()); // 1 
console.log(counter()); // 2

И понять не могу, почему, когда во второй раз вызывается функция counter значение переменной current не становиться 0? Почему функция запоминает значение один, которое стало после первого вызова?

Answer 1

Все просто. В начале вызывается только внешняя функция.

var counter = (function() { var current = 0; return function() {...} })();

То есть происходит присваивание counter вложенной функции и устанавливается значение переменной current = 0.

В итоге counter будет равен этой функции function() { current++; return current; }

И затем при вызове counter вызывается только эта внутренняя функция.

Answer 2

Потому что этот return

return function() {
  current++;
  return current;
}

возвращает не "голую" анонимную функцию, а функцию вместе с окружением, включающим экземпляры всех локальных переменных и параметров, видимых из этой анонимной функции и используемых в ней.

function counterCreator() { 
  var current = 0; 
  return function() { 
    current++; 
    return current; 
  } 
} 
 
var counter1 = counterCreator(); 
console.log("counter1", counter1(), counter1(), counter1()); 
 
var counter2 = counterCreator(); 
console.log("counter2", counter2(), counter2(), counter2()); 
 
console.log("counter1", counter1(), counter1(), counter1());