How do I search through scope variables in Google Chrome Developer Tools?

问题

I set a breakpoint in a javascript function with Google Chrome Developer Tools.

I am looking for a variable in the scope variables of the function with the value "Fred." How do I search for this value amongst the variables within the scope of the function?

回答1:

You can set a breakpoint within Chrome DevTools on a particular line, that's within the scope/context of said variable. When browser execution reaches the breakpoint, you'll have access to all variable/functions within its, and the global, scope.

You could also utilize Chrome's console and output any variable that's accessible within the current scope. For more information about Chrome DevTools visit:

https://developers.google.com/chrome-developer-tools/

回答2:

You'll need to add a script to the console so that you can actually perform a search, as the Developer Tools don't allow for this by default. Here's that function for you (See my Gist comment below for an update):

function scanScope(whatToScan, scanValue) {
	for (var key in whatToScan) {
		if (whatToScan[key] == scanValue) {
			console.log(key + ' = ' + whatToScan[key]); 		
		} else {
			if( (typeof whatToScan[key] === "object") && (key !== null) ) { 
				scanScope(whatToScan[key], scanValue);
			}
		}
	}
}

Copy and paste that into the console, and then call it with the scope you want to search through and the value you want to search for. Be careful that you don't search too large an object, of course. If you're programming in Angular, for instance, and following the "always have a dot" rule, you can scan through it with a call like:

scanScope($scope.model, 'Fred');

回答3:

manually in console this way:

console.log(this);

console.log({set x(){}});

which is equivalent to:

console.log(Object.defineProperty({},'x',{get: function(){}}));

in console look up:

get x: function (){} --> <function scope> --> Global: Window

来源：https://stackoverflow.com/questions/11438549/how-do-i-search-through-scope-variables-in-google-chrome-developer-tools

标签

javascript

google-chrome-devtools