从开发者控制台访问私有成员？

Question

以前，我会使用旧的命名约定，将预期为私有的字段命名为带有_后缀或前缀。

class X{
  constructor() {
    this.privateField_;
  }
  
  privateMethod_() {}
}

现在使用 # 符号可以实现真正的私有访问权限，我已经开始使用它们了。

class X{
  #privateField;

  #privateMethod() {}
}

但是我遇到的一个情况是在调试时需要访问这些私有成员。但是当然，它们是私有的，所以除非我编写一些仅用于调试的包装器/访问器，否则我无法访问它们。如果我事先不知道需要调试哪些字段/类，这种方法就不实际了。使用下划线（_）命名约定，可以轻松绕过意图。

在使用Chrome开发者控制台时，是否有办法绕过私有修饰符，就像它允许您在async块之外使用await一样？

- junvar

---

如果您将整个对象记录到控制台，则应该能够展开它并以此查看所有属性。 - Barmar

谢谢，你是对的，我能看到字段的值。但是 1）我不能调用方法，或者 2）访问私有字段上的函数。 - junvar

私有就是私有。你可以定义一个toString()的覆盖方法，以便查看私有字段的值，当然你也可以定义公共方法或从公共方法调用它们并观察它们的效果(类似单元测试)。 - Heretic Monkey

你可以在公共方法中设置断点，然后调用该方法。当调试器在类内部的断点上暂停时，它允许你访问该类的私有成员。 - Donald Duck

Answer 1

一个解决方法是在类定义的范围内设置断点（例如在公共方法中，然后调用该方法）。在断点处暂停时，您可以在调试器控制台中评估能够访问私有字段的代码。

---

而且 自从Chrome 111版本, 这个解决方法已经不再必要，你可以直接从控制台访问私有字段和方法:

为了更好地促进调试，DevTools现在支持评估具有私有类成员的表达式。(1381806)

- Bergi

---

我遇到了一个错误：未捕获的语法错误：引用了未声明的私有字段或方法。 - undefined