javascript - 从 console.log 自定义打印？

Question

假设我有这门课。

class Attribute {
  constructor(name) {
    this.name = name;
  }
}

然后我创建一个实例并将其记录到控制台以进行调试。

const test = new Attribute('Large');
console.log(test);

如何让它输出特殊格式的字符串，比如 {Attribute} Large？我主要关心 Chrome 支持，但 Node 和其他浏览器也不错。

Answer 1

明智的解决方案可能是使用自定义日志记录功能，将 Attribute 值字符串化。

但是，如果你对将来需要维护你的代码的人有仇，一个满足这个问题技术要求的解决方案是让你的类扩展一个console.log 自动序列化为字符串，如 RegExp。当您 console.log 一个 RegExp 实例时，Chrome(可能还有其他环境)会自动将其序列化为它的裸 /.../ 表达式。通过提供自定义 toString 函数，只需覆盖它应该序列化的字符串，您就得到了您想要的。

class Attribute extends RegExp {
  constructor(name) {
    super();
    this.name = name;
  }
  toString() {
    return this.name
  }
}
var test = new Attribute('Large');
console.log(test);

这大致相当于回答“如何阻止我的房子被洪水淹没？”这个问题。用“把你的房子放在一个巨大的木筏上”而不是“在你的地下室放些填缝剂”或“搬到其他地方”。一些副作用包括:

• 您的对象将继承正则表达式属性，例如 global 和 exec

• 测试您的对象是否为 instanceof RegExp 当然会返回 true，这可能会导致您的对象成为仅希望对正则表达式对象进行操作的例程的有效输入

使用进一步的黑魔法，您可以通过以下方式解决这些问题

Object.setPrototypeOf(Attribute.prototype, Object.prototype);

紧接在您的 class 定义之后，这将确保您的 this 对象将简单地通过 RexExp 构造函数运行(从而将其标记为字符串化 log 输出)但不继承自 RexExp.prototype。通过将 class 和 prototype 语法混合在一起，您还可以确保您的代码令人困惑，并且每个人都非常害怕它。