Chrome Inspector中的Javascript调试:变量未在手表和控制台中显示，但在悬停时可以检查 [英] Javascript debugging in Chrome Inspector: variables are shown undefined in watches and console but can be inspected when hovered

问题描述

在Chrome检查器中调试AngularJS时，我经常遇到这种情况，当我知道定义了一些变量时，可以通过将鼠标悬停在Chrome检查器中来检查它们.它们还会显示在本地"标签中.但是，当我尝试将它们添加到监视"选项卡或在控制台中通过键入变量名称来评估它们时，我得到未定义".参见图片(注意变量"xhr").

While debugging AngularJS in Chrome inspector I often face the situation when I know that some variables are defined, and I can inspected them by hovering a mouse over them in Chrome inspector. They also appear in 'locals' tab. However, when I try to add them to watch tab or evaluate them in console by typing the variable name I get "undefined". See picture(notice variable 'xhr').

有人能解释为什么变量在当前范围内实际上不是未定义的情况，但有时在监视选项卡和控制台中显示为未定义的原因吗?并且，如果可能的话，如何使监视窗口和控制台始终正确显示变量的值? 请参见图片(注意变量'xhr'). 谢谢

Can anyone explain the reason why sometimes variables are shown as undefined in watch tab and console, when they aren't actually undefined in current scope? And, if it's possible, how to make watch window and console to display values of the variables correctly all the time? See picture(notice variable 'xhr'). Thanks

推荐答案

源映射的变量将不会在调试器中显示解析的名称，因为尚未实现此功能.有趣的是，映射文件确实包含一个names数组，其中包含原始名称.但是，浏览器尚未使用它.金丝雀中有一个实验性功能，但似乎不再存在.

Source mapped variables will not show the resolved names in the debugger, as this functionality has yet to be implemented. The interesting part is that the map file does contain a names array, containing the original names. However, the browser has yet to use this. There was an experimental feature in Canary, but that doesn't appear to exist anymore.

您可以遵循在开发人员工具中显示源地图变量名称线程.

同时，我建议切换到该库的最小版本来调试您的特定问题，但是在生产中将其切换出去.我知道这不理想.

In the meantime, I recommend switching to the un-minified version of the library to debug your particular problem(s), but switch it out in production. Not ideal I know.

这篇关于Chrome Inspector中的Javascript调试:变量未在手表和控制台中显示，但在悬停时可以检查的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！