Почему функция не замыкается?

Question

[alex4answ]

Не могу понять, почему не замыкается функция?
https://jsfiddle.net/wvLzhxe4/

let x = 1;

function createSum(){
	return function(){
  	return x + 5;
  }
}

function foo(){
  let x = 5;
  return createSum()();
}

function bar(){
  let x = 50;
  return createSum()();
}

console.log(foo()); // 6
console.log(bar()); // 6

почему в bar не 55, ведь createSum должен брать переменную x из внешнего лекс окружения, но берет из глобального, почему?

Answer 1

[Alex]

Функция берет значения из контекста в котором она объявлена а не в котором она вызвана.

Comments

[alex4answ]

Alex, понял-принял, спасибо, пытаюсь найти примеры и задачи по замыканию, везде тривиальные "делаем счетчик" и тп, вот и пытаюсь накостылить каких-то себе примеров, и сам себя загоняю в тупиик, спасибо за помощь)

[alex4answ]

Alex , а как можно решить вопрос?
например если в createSum какие-то вычисления есть, чтобы не создавать новую функцию и в foo и bar, а использовать "генератор" функции, вместо того, чтобы дублировать код?

let x = 1;
function foo(){
    return function(){
  	return x + 5;
  }
}

function bar(){
  let x = 50;
    return function(){
  	return x + 5;
  }
}

console.log(foo()()); // 6
console.log(bar()()); // 55

[Alex]

alex4answ, Создаёте функцию-конструктор, которая принимает какие-то параметры — конфигурация. И эта функция возвращает другую. Вложенная тоже будет иметь доступ к параметрам через замыкание

function getSumStrategy(maxValue, minValue) {

  return function (a, b) {
    return Math.max(minValue, Math.min(maxValue, a + b))
  }

}

function foo(sumStrategy) {
    return sumStrategy(1, 5)
}

function bar(sumStrategy) {
    return sumStrategy(10, 5)
}

function baz(sumStrategy) {
    return sumStrategy(20, 5)
}



const sumStrategy = getSumStrategy(20, 10)
foo(sumStrategy) // 10
bar(sumStrategy) // 15
baz(sumStrategy) // 20

Answer 2

[frontend queen]

let x = 1;

function createSum(x){
  return x + 5;
}

function foo(){
  let x = 5;
  return createSum(x);
}

function bar(){
  let x = 50;
  return createSum(x);
}

console.log(foo());
console.log(bar());

Comments

[alex4answ]

frontend queen, я понимаю что можно сделать так, я пытаюсь разобраться с замыканием, не с простыми примерами типа "создаем счетчик и тп", а с чем-то более запутанным

Answer 3

[Mesuti]

Потому что в createSum() не отправляется X.
Эта функция берет X из глобального окружения.

Например, можно убрать повторные инициализации X и будет обновляться глобальный X

let x = 1;

function createSum(){
	return function(){
  	return x + 5;
  }
}

function foo(){
	x = 5;  // del let
  return createSum()();
}

function bar(){
	x = 50;   // del let
  return createSum()();
}

console.log(foo());
console.log(bar());