Javascript 如何在 Google Chrome 开发者工具中搜索范围变量?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11438549/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 05:49:00  来源:igfitidea点击:

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

javascriptgoogle-chrome-devtools

提问by dangerChihuahua007

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

我使用 Google Chrome 开发人员工具在 javascript 函数中设置了一个断点。

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?

我正在函数的作用域变量中寻找值为“Fred”的变量。如何在函数范围内的变量中搜索此值?

采纳答案by xandercoded

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.

您可以在 Chrome DevTools 中的特定行上设置断点,该行位于所述变量的范围/上下文内。当浏览器执行到达断点时,您将可以访问其和全局范围内的所有变量/函数。

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:

您还可以利用 Chrome 的控制台并输出当前范围内可访问的任何变量。有关 Chrome DevTools 的更多信息,请访问:

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

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

回答by Dan Overlander

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):

您需要向控制台添加一个脚本,以便您可以实际执行搜索,因为默认情况下开发人员工具不允许这样做。这是适合您的功能(有关更新,请参阅下面的 Gist 评论):

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:

将其复制并粘贴到控制台中,然后使用要搜索的范围和要搜索的值调用它。 当然,请注意不要搜索太大的对象。例如,如果您正在使用 Angular 进行编程,并且遵循“始终有一个点”规则,则可以使用如下调用扫描它:

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

回答by xandercoded

manually in console this way:

以这种方式在控制台中手动:

console.log(this);

OR

或者

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

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