user6027445
user6027445

Reputation:

Javascript -- Closures with Simple Adder Function

I'm a Python coder learning more about Javascript.

I'm having a bit of difficulty understanding Closures for some reason. I've produced the simple Adder function (i.e. Should do something like Add(1) = 1, Add(2) = 3...)

I've been trying to understand what's going on under the hood via console.log/printing everything but I'm confused on how these functions are different, if they are:

var makeAdder = function(num){
  var addNum=num;
  var letsAdd = function(num){
    return addNum+=num;
  };
  return letsAdd;
};

var makeAdder = function(numa){
  var letsAdd = function(numb){
    return numa+numb;
  };
  return letsAdd;
};

var a = makeAdder(2);
console.log(a(5));
// should produce 7 at the end

Upvotes: 1

Views: 2807

Answers (4)

chessweb
chessweb

Reputation: 4645

A little bit simpler and more concise:

function makeAdder(n) { 
    return function(x) {
        return x + n;   // closure over n
    };
};

var add5 = makeAdder(5);    
var add7 = makeAdder(7);    

console.log(add5(10));   // 15
console.log(add7(10));   // 17

Upvotes: 1

Pravin Agrawal
Pravin Agrawal

Reputation: 51

Solution for a simple adder function without using closures.

function makeAdder(num){
  if(!this.addNum){
    this.addNum=0;
  }
  return this.addNum+=num;
}

console.log("------------makeAdder----------");

console.log(makeAdder(10)); // output - 10
console.log(makeAdder(20)); // output - 30
console.log(makeAdder(30)); // output - 60

Upvotes: 1

Saurabh Verma
Saurabh Verma

Reputation: 1544

In Javascript when a variable is declared inside a function, it becomes local to that function. So when the function completes the execution, Garbage collector destroys all the local variables. But in case of closures, it cannot. Because a link to those function variables gets created from outside the function.enter image description here

In the above picture N moves out of the scope of F and becomes available outside. A good read on closure is in Object Oriented Javascript by Stoyan Stefanov

So in closures the local variables are not destroyed and the value is stored for future use.In your case, you are creating a closure by using the local variables addnum and numa in function letsAdd which is then returned outside the function and hence available from outside,creating a link.

The first makeadder has the local variable which has the sum of last two values i.e. addnum is saved. And hence when the next time you are calling, you are getting the sum. While the second function has an external link to numa which is not the sum of last two variable. So the value gets saved is only the value of first parameter. So in the subsequent calls the first parameter to the add is different in both the functions.

Upvotes: 0

gurvinder372
gurvinder372

Reputation: 68413

First makeAdder adds to last added value addNum+=num; which is why you can keep adding to the previously added value

So, first makeAdder will return what you want

var a = makeAdder(2);
a(1);//output 3
a(4);//output 7

However, second makeAdder is not adding to last added value numa+numb; so it is not able to add it to previous value

var a = makeAdder(2);
a(1);//output 3
a(4);//output 6 not 7

Upvotes: 0

Related Questions