Замыкания в JS, каким образом при замыкании выходит данный результат?

Question

[Maks Burkov]

function makeAdder(x) {

    return function(y) {
        return x + y;
    };
};

var add5 = makeAdder(5);
var add10 = makeAdder(10);

console.log(add5(2));  // 7
console.log(add10(2)); // 12
Всем привет! Не понятен пример замыкание в данном коде ..

Как выходит 7 и как выходит 12 ? Кто-то может объяснить Flow данной функции ?

Answer 1

[timfcsm]

Как работает замыкание вообще и в JavaScript, в частности?

Answer 2

[Anton fon Faust]

Ваш код равносилен этому:

function makeAdder() {
    var x=arguments[0];
    return function() {
        var y=arguments[0];
        return x + y;
    };

};

Дальше, когда вы вызываете makeAdder(5), переменная add5 становится ссылкой на функцию function(y) {
return x + y;
};
А эта функция хранит в себе значения из родительской области видимости, т.е. переменную x
Соответственно, когда вы вызывавете add5(2), в return x + y; у вас подставляются значения 5 и 2 соответственно.
Вот и все.

Comments

[Maks Burkov]

Просто не понятны скрытые процессы, которые происходят в данном алгоритме .. Теоретически про область видимости понятно.. Но, еше один момент хотел у вас уточнить.. При первом вызове makeAdder(5) создаётся обьект с локальной переменной окружения , при вызове makeAdder(10) создаётся еше один обьект с локальной переменной окружения (для каждого вызова свой обьект ? ). После чего так как была вернута сама функция var add5 и var add10 содержат ссылки на собственный созданный обьект, который содержит свою внешнюю переменную и функцию , которая имеет доступ к этой переменной и тогда при вызове add5 и add10 вызывается внутренняя функция каждого обьекта с его локальной переменной ? Както так .. скажите да плиз... (мозги взрываются=))!!

[Anton fon Faust]

Maks Burkov: ага, совершенно верно.

Answer 3

[romy4]

при создании объекта X сохраняется внутрии области видимости возвращаемой фунции. дальше вы уже вызываете вторую функцию в которой Х известен и У приходит как параметр.

Answer 4

[Петр]

Вызов makeAdder возвращает обьект-функцию для которой сохранено окружение в виде переменной х.
Затем вы делаете вызов данной обьект-функции add5(2) с параметром y.