简体   繁体   中英

Programmatically accessing function scope using Chrome DevTools console

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 .

Chrome DevTools控制台的屏幕截图

  • 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.

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?

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM