Programmatically accessing function scope using Ch

2020-02-10 08:21发布

问题:

When I open up Chrome (v35) DevTools and inspect an object, the console can show me things nested within functions, including something labeled as the '"function scope".

For example, when looking at stackoverflow.com, I can see that there's a global $ object containing another function called Callbacks. Callbacks, as does $, has a functional scope containing Closure and Global.

  • Question 1: What is the difference between some named object nested directly within a function and some object contained within a Closure in its function scope?
  • Question 2: How do I programmatically reference a function scope in the console? window.$.Callbacks.???? chrome.function???(window.$.Callbacks)

The reason I ask is because I'm looking for memory leaks and would like to search the objects held within functions' closures based on object types and property names.

回答1:

What is the difference between some named object nested directly within a function and some object contained within a Closure in its function scope?

The object nested directly with the function is a property of the function object. For example, $.Callback has a .length property with value 1, it does have a .prototype property, it does inherit (__proto__) from Function.prototype etc.

The object in the scope is a variable that is accessible from the scope that surrounds the function. See How do JavaScript closures work?

How do I programmatically reference a function scope in the console?

You cannot. Scopes are not programatically accessible. I don't think the devtools have any helpers to allow this either. See also How do I search through scope variables in Google Chrome Developer Tools?