此页面由 Cloud Translation API 翻译。

开发者工具的新变化 (Chrome 80)

Kayce Basques

支持在管理中心内使用 `let` 和 `class` 重复声明

控制台现在支持重复声明 let 和 class 语句。对于使用控制台尝试新的 JavaScript 代码的 Web 开发者来说，无法重新声明一直是他们常见的烦恼。

警告：在 Console 以外的脚本中或在单个控制台输入内重新声明 let 或 class 语句，仍会导致 SyntaxError。

例如，之前在使用 let 重新声明局部变量时，控制台会抛出错误：

Chrome 78 中的管理中心屏幕截图，显示 let 重新声明失败。

现在，控制台允许重新声明：

Chrome 80 控制台的屏幕截图，显示 let 重新声明成功。

Chromium 问题 #1004193

改进了 WebAssembly 调试

开发者工具已开始支持 DWARF 调试标准，这意味着更多支持在开发者工具中单步调试代码、设置断点以及解析堆栈轨迹。如需了解完整内容，请参阅 Chrome 开发者工具中改进的 WebAssembly 调试功能。

由 DWARF 提供支持的新 WebAssembly 调试的屏幕截图。

网络面板更新

“Initiator”标签页中的请求发起者链

现在，您能够以嵌套列表的形式查看网络请求的发起者和依赖项。这有助于您了解请求资源的原因，或者某个资源（如脚本）导致了哪些网络活动。

“Initiator”标签页中请求发起者链的屏幕截图

在在“网络”面板中记录网络活动后，点击相应资源，然后转到发起方标签页以查看其请求发起方链：

检查的资源以粗体显示。在上面的屏幕截图中，https://web.dev/default-627898b5.js 是检查的资源。
所检查的资源上方的资源是发起者。在上面的屏幕截图中，https://web.dev/bootstrap.js 是 https://web.dev/default-627898b5.js 的发起者。换句话说，https://web.dev/bootstrap.js 导致了对 https://web.dev/default-627898b5.js 的网络请求。
所检查资源下的资源是依赖项。在上面的屏幕截图中，https://web.dev/chunk-f34f99f7.js 是 https://web.dev/default-627898b5.js 的依赖项。换句话说，https://web.dev/default-627898b5.js 导致了对 https://web.dev/chunk-f34f99f7.js 的网络请求。

Chromium 问题 #842488

在“概览”中突出显示所选的网络请求

当您点击某个网络资源以对其进行检查后，“网络”面板现在会在概览中为该资源添加蓝色边框。这有助于您检测网络请求的发生时间是否早于预期。

“Overview”窗格的屏幕截图，突出显示了已检查的资源。

Chromium 问题 #988253

“网络”面板中的网址和路径列

您可以使用网络面板中新的路径和网址列查看每个网络资源的绝对路径或完整网址。

“网络”面板中新“路径”和“网址”列的屏幕截图。

右键点击 Waterfall 表格标题，然后选择 Path 或网址以显示新列。

Chromium 问题 #993366

已更新用户代理字符串

开发者工具支持通过网络条件标签页设置自定义用户代理字符串。用户代理字符串会影响附加到网络资源的 User-Agent HTTP 标头，以及 navigator.userAgent 的值。

预定义的用户代理字符串已更新，以反映最新的浏览器版本。

“网络条件”标签页中“用户代理”菜单的屏幕截图。

如需访问网络条件，请打开命令菜单，然后运行 Show Network Conditions 命令。

Chromium 问题 #1029031

审核面板更新

新的配置界面

配置界面采用全新的自适应设计，并简化了限制配置选项。如需详细了解限制界面更改，请参阅审核面板限制。

新的配置界面。

“覆盖率”标签页更新

按函数或按块覆盖模式

“覆盖率”标签页有一个新的下拉菜单，可用于指定是按函数还是按块收集代码覆盖率数据。按地址块的覆盖范围更详细，但收集数据的成本也要高得多。默认情况下，开发者工具现在使用按函数覆盖率。

覆盖模式下拉菜单。

现在必须通过页面重新加载启动覆盖率

移除了在不重新加载页面的情况下切换代码覆盖率的功能，因为覆盖率数据不可靠。例如，如果某个函数执行时间是很久以前，并且 V8 的垃圾回收器已对其进行清理，则系统可能会将其报告为未使用。

Chromium 问题 #1004203

下载预览渠道

您可以考虑将 Chrome Canary 版、Dev 版或 Beta 版用作默认开发浏览器。通过这些预览渠道，您可以使用最新的开发者工具功能，测试先进的网络平台 API，并在用户采取行动之前发现网站上的问题！

与 Chrome 开发者工具团队联系

使用以下选项讨论博文中的新功能和变化，或讨论与开发者工具有关的任何其他内容。

通过 crbug.com 提交建议或反馈。
使用开发者工具中的更多选项 > Help > Report a DevTools issues来报告开发者工具问题。
发推文：@ChromeDevTools。
请在 YouTube 视频或“开发者工具提示”YouTube 视频中留言说明“开发者工具的新变化”。