Javascript Chrome DevTools'&引用；“热切的评价”；预览文本将显示？

作为Chrome 68之后的一个选项（Chrome 72或更早版本之后默认启用），DevTools控制台会在您为某些表达式键入“急切求值”结果预览时执行此操作

例如，如果您键入

encodeURIComponent(document.querySelector('.top-bar .-logo').innerHTML);

你会得到一个粉红色的预览

"%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class%3D%22-img%20_glyph%22%3EStack%20Overflow%3C%2Fspan%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20"

在下面，不按Enter键

然而，这不起作用，比如说

document.querySelector('.top-bar .-logo').href;

而且（正如预期的那样）它不适用于包含循环的表达式

是否在某个地方记录了哪些表达式适用于此，哪些不适用？这篇专题文章的结尾提到

如果表达式导致错误，DevTools不会立即求值

但这似乎无法解释为什么它适用于

.innerHTML

，而不适用于

.href

---

究竟是什么决定了它将尝试计算哪些表达式？

它们使用了一个非常复杂的白名单系统，这可能是错误的

基本上，它们有一些标记为安全的内置项，遍历表达式的所有内部，一旦不知道某个内容是否安全就退出

至于解释为什么你给出的两个表达式没有产生相同的结果。。。这可能相当复杂。
但我们已经注意到，两者都是，因此都将调用内部函数以返回计算值。这个getter函数本身可以运行一些有副作用的代码

比如说

const o = {
  _count: 0,
  get count() { return this._count++; }
};

从这里开始，计算

o.count

将增加

\u count

属性，因此此getter被标记为不安全

现在，我不得不承认，我不确定

.href

内部调用了什么，以及为什么这个算法会将其标记为不安全，但很明显，有一些东西。。。

---

如果您确实想知道它是什么，那么您可能需要检查

document.baseURI

内部，它必须从

.href

调用，并且它本身被标记为不安全。

这就是问题所在。您可以从控制台的设置面板（控制台区域右上角的小齿轮图标）打开和关闭它。您已经确定了行为的名称，但这不是我想要的。您（错误地）将其标记为重复的问题的或答案实际上都没有解释为什么，.innerHTML有效，而.href无效。更新说明确实说它不会评估它是否会导致副作用，但是get.href是如何导致副作用的？抱歉，我误解了你的问题。您是否介意明确说明您的目标（例如，您可以使用正确的术语，而不是链接到完全不记录此功能的页面，而是不相关的页面）。那我就可以重新打开了。至于

.href

如何引起副作用，它实际上是一个getter函数，因此可能有副作用（但就像innerHTML一样，它们可能确实有一个白名单，甚至是一个坏名单，因为它们确实有一些属性，如

offsetTop

，它们确实有副作用。这很公平。编辑以澄清问题。它还使用生成的大量代码作为查找表……innerHTML被标记为没有副作用的getter，但href不是.g。）不过，eAttribute是安全的。事实上，所有不同风格的HTMLWhateverElement及其可能的数百个getter都不在这个列表中。