I would like to see the content of a closure in JavaScript.

In the following code, I would like to see the closure of the function closure_f returned by the anonymous function. The local scope of the anonymous function must be stored somewhere, I would like to see where it is stored. How can this be done in Node or in the browser?

var closure_F = (function(){
var info = "info-string";
var f1 = function(){
    console.log(info);
};
return f1;
}());

closure_F(); // logs 'info-string' as expected.
console.log(closure_F); // This did not provide any valuable information.

I would like to see the content of a closure in JavaScript.

In the following code, I would like to see the closure of the function closure_f returned by the anonymous function. The local scope of the anonymous function must be stored somewhere, I would like to see where it is stored. How can this be done in Node or in the browser?

var closure_F = (function(){
var info = "info-string";
var f1 = function(){
    console.log(info);
};
return f1;
}());

closure_F(); // logs 'info-string' as expected.
console.log(closure_F); // This did not provide any valuable information.

• javascript
• node.js
• closures

• Add a debugger statement, then step through the code. – Jonas Wilms Commented Jan 13, 2019 at 9:33
• 1 Do a console.dir(closure_F) in Chrome and look at [[Scopes]]. – Felix Kling Commented Jan 13, 2019 at 9:44
• What runtime do you use? In Chrome devtools you can inspect the closure environment of a logged function. – Bergi Commented Jan 13, 2019 at 9:44

2 Answers 2

WAY 1: Internal property [[Scope]]

You can modify your code by adding console.dir and then run it in the Chrome Dev Console:

var closure_F = (function(){
  var info = "info-string";
  var f1 = function(){
    console.log(info);
  };

  return f1;
}());

closure_F();
console.dir(closure_F); 
// console.dir prints all the properties of a specified JavaScript object

If you open the console you will see that it prints all the properties of the object (function), including the internal property [[Scopes]].

This internal property [[Scopes]] will contain any surrounding scopes of the closure_f, and its closure. See example:

Note: [[Scope]] is an internal implementation of JS and cannot be programatically accessed within the program.

WAY 2: Setting a breakpoint - debugger

Another way to see the Closure of a function is to add a debugger statement and create a break point in the function who's closure you want to inspect. As an example you can run this in the console:

function createClosure (){

  var secret = "shhhhh";

  return function inner(){
    debugger;
    console.log(secret);
  };
  
};

var innerFunction = createClosure();

innerFunction();

www.ecma-international >> [[Scope]] >> Table 9

The local scope of the anonymous function must be stored somewhere

That's an implementation detail of the JavaScript runtime. It isn't stored anywhere that is exposed to the JavaScript program.

How can this be done in Node or in the browser?

Dedicated debugging tools can inspect the data there. Set a breakpoint on the console.log call.

Note that optimisations mean that only variables used within the returned function will be visible.