Web Inspector 控制台改进
控制台是 Web Inspector 的重要组成部分。在快速控制台中评估表达式是与被检查页面交互的主要方式之一。页面发出的日志、错误和警告会显示在控制台中，而调试时，探索或与这些对象交互是必然的。我们最近改进了 Web Inspector 中的控制台和对象视图，使其更强大、更有趣。我们的主要重点是更快地访问有用数据，并使其现代化以更好地适应 JavaScript 的新变化。
基础知识 – 对象预览、树和 $n
对象预览允许您无需展开即可查看前几个属性。您会注意到，每次评估都会为您提供一个“$n”调试器变量，以便稍后引用该对象。这些特殊变量仅供工具使用，因此您不会用临时变量来弄乱页面。$0 仍然存在，并引用 DOM 树中当前选定的节点。
展开后，完整的对象树视图清晰地分离了属性和 API。我们再次尽可能使用对象预览，以便一目了然地显示更多数据。每个属性的图标对应于该属性值的类型。例如，在下图中您会看到数值属性带有蓝色 N 图标，字符串带有红色 S，函数带有绿色 F 等。这些图标为对象提供了视觉模式，并使您可以轻松地直观查找特定属性或对象所持有的正常数据中意外的变化。
支持新类型
Web Inspector 一直对检查某些内置 JavaScript 类型（如数组）和 DOM 类型（如节点）有很好的支持。Web Inspector 改进了这些视图，现在全面支持所有内置 JavaScript 类型。这包括新的 ES6 类型（Symbol、Set、Map、WeakSet、WeakMap、Promises、Classes、Iterators）。
WebKit 的工具在显示只有引擎才知道的、否则无法访问的对象内部状态时最有用。例如，显示 Promise 的当前状态。
或原生迭代器的未来值。
其他有趣的案例是显示 WeakSets 和 WeakMaps 中的值，或显示绑定函数的原始目标函数和绑定参数。
API 视图
展开对象的原型时，您会得到一个出色的 API 视图，显示您可以对该对象调用的方法。API 视图始终为用户函数提供参数名称，甚至为原生函数提供精选版本。API 视图使得查找或发现您在控制台中已有的对象交互方式变得非常方便。
额外的好处是，如果您正在使用 ES6 类并通过其名称或构造函数记录一个类，您会立即获得该类的 API 视图。
交互性
对象树更具交互性。将鼠标悬停在属性图标上可查看属性的描述符属性。将鼠标悬停在属性名称上可查看用于访问该属性的精确路径。Getter 可以被调用，并且其结果可以进一步探索。
上下文菜单也提供了更多选项。其中一个最强大的功能是，对于对象树中的任何值，您可以使用上下文菜单并选择“Log Value”将其重新记录到控制台。这会立即为实时对象创建一个 $n 引用，让您可以与之交互或稍后轻松引用它。
控制台消息
控制台消息的用户界面也进行了更新，使日志、错误、警告及其位置链接更加突出。
反馈
这些增强功能可在 WebKit Nightly 构建版本中使用。我们非常乐意听取您的反馈！您可以通过 Twitter (@JosephPecoraro, @xeenon) 向我们发送快速反馈，提交错误报告，甚至考虑贡献您自己的增强功能！