Jump to content


Check out our Community Blogs

Register and join over 40,000 other developers!


Recent Status Updates

View All Updates

Photo
- - - - -

Javascript Closures Help. Unable to save copy of "count' within an IIFE function

javascript closure iife scope functions

  • Please log in to reply
1 reply to this topic

#1 An Alien

An Alien

    CC Addict

  • Senior Member
  • PipPipPipPipPip
  • 323 posts
  • Programming Language:Java
  • Learning:C, Java, PHP, Python, JavaScript, Lisp, Transact-SQL, Others

Posted 11 September 2017 - 10:42 PM

So I have a global var called count which changes from 0 to 4 in between two function declarations (see myFuncs array).

 

I want to create a closure and save a copy of count of 0 for the 1st function and 4 in the 2nd function.

 

Somehow, even though I'm using IIFE (Immediately Invoked Function Expressions) to create new lexical scope and saving the copy of count with (as j), they are still both pointing to count = 4 and thus when the functions are executed, the first and second function both print out "My value: 4" twice when I expected:

"My value: 0"
"My value: 4"

 

Code:


var myFuncs = {};

var count = 0;

myFuncs[0] = function(){
    (function(){
        var j = count; //create a closure over the count value and save it inside the IIFE scope
        console.log("My value: " + j); //expecting j to be 0
    })();
}

count = 4;  //Update value inbetween two function declarations

//same as above but the j here should be 4
myFuncs[1] = function(){
    (function(){
        var j = count; //create a closure over the count value and save it inside the IIFE scope
        console.log("My value: " + j);
    })();
}

myFuncs[0](); //My value: 4
myFuncs[1](); //My value: 4


  • 0

#2 RhetoricalRuvim

RhetoricalRuvim

    JavaScript Programmer

  • Expert Member
  • PipPipPipPipPipPipPip
  • 1310 posts
  • Location:C:\Countries\US
  • Programming Language:C, Java, C++, PHP, Python, JavaScript

Posted 25 October 2017 - 03:36 PM

What you want is to grab a copy of the "count" right away, not delaying it till after "count" has changed. What you are doing now is: 

  • Define myFuncs[0] as a function that uses "count". 
  • Change "count". 
  • Call myFuncs[0], which saves a copy of "count", but "count" has changed by the time you call this function, so therefore the count is always 4. 

You are close to the answer. Instead of calling the inside anonymous function right away, you need to wrap the myFuncs[0] = ... inside an outside anonymous function, and call this outside anonymous function right away, before you change "count". 

 

Consider the following example: 

var fs = []; 
for (var i = 0; i < 4; i++) { 
	(function () { 
		var k = i; 
		fs.push (function () { 
			console.log (k); 
                }); 
        }) (); 
} 
for (var j = 0; j < 4; j++) fs[j] (); 

Or, simpler yet, 

(function () { 
	var k = i; 
	fs.push (function () { 
		console.log (k); 
        }); 
}) (); 

There is an outside wrapper anonymous function that gets called right away, and that is the function that saves a copy of "i". Remember, it needs to save a copy before "i" changes, so you need to call it right away, before you change "i" (or "count" in your case). 

 

On the other hand, the inside of this outer function adds a function to the "fs" array. This inside function is just a normal function that uses the saved variable "k". 


  • 0
Regards,
RR





Also tagged with one or more of these keywords: javascript, closure, iife, scope, functions