Why currying function works different from normal function in javascript for this case?

Question

I created a generator. to run the code,

The final part is written in this way.

const genratorAnimation = gen(); 

let result = genratorAnimation.next();
genratorAnimation.next();

let interval = setInterval(function(){
   if(!result.done) {
     genratorAnimation.next();
   }
   else {
    clearInterval(interval)
   }
}, 50);

I tried to run this using non-currying function like.

let result = gen().next();
gen().next();

let interval = setInterval(function(){
   if(!result.done) {
    gen().next();
   }
   else {
    clearInterval(interval)
   }
}, 50);

However, it doesn't run the code properly. Why is that? After reading postings here and other sources, the explanation seems like currying function is just another way of representing functions to me.

But this time, I realized that it's not it has a huge difference. Can anyone let me know the difference?

Answer 1

Everytime you call gen() you return a new Generator so you constantly reinitialize it. That's why your code doesn't work when using the second version.

Your example could be summarized with this:

const add = function () {
  var counter = 0;
  return function () { counter += 1; return counter; }
};

const count = add();

// Works
console.log('Works');
console.log(count());
console.log(count());
console.log(count());

//Doesn't work
console.log('Doesn\'t work');
console.log(add()());
console.log(add()());
console.log(add()());