Object.defineProperty 覆盖只读属性

Question

在我们的 NodeJS 应用程序中，我们通过扩展默认错误对象来定义自定义错误类：

"use strict";
const util = require("util");

function CustomError(message) {
    Error.call(this);
    Error.captureStackTrace(this, CustomError);
    this.message = message;
}

util.inherits(CustomError, Error);

这使我们能够 throw CustomError("Something"); 正确显示堆栈跟踪，并且 instanceof Error 和 instanceof CustomError 都可以正常工作。

然而，对于 API（通过 HTTP）中的 returning 错误，我们希望将错误转换为 JSON。在错误上调用 JSON.stringify() 导致 "{}"，这显然对消费者来说不是真正的描述。

为了解决这个问题，我想到了将 CustomError.prototype.toJSON() 覆盖为 return 带有错误名称和消息的对象文字。 JSON.stringify() 然后将这个对象字符串化，一切都会很好：

// after util.inherits call

CustomError.prototype.toJSON = () => ({
    name    : "CustomError",
    message : this.message
});

但是，我很快看到这会抛出一个 TypeError: Cannot assign to read only property 'toJSON' of Error。这可能是有道理的，因为我正在尝试写入原型。所以我改为更改构造函数：

function CustomError(message) {
    Error.call(this);
    Error.captureStackTrace(this, CustomError);
    this.message = message;
    this.toJSON = () => ({
        name    : "CustomError",
        message : this.message
    });
}

这样（我预计），将使用 CustomError.toJSON 函数并忽略 CustomError.prototype.toJSON（来自错误）。

不幸的是，这只会在对象构造时抛出错误：Cannot assign to read only property 'toJSON' of CustomError。

接下来我尝试从文件中删除 "use strict";，这有点解决了问题，因为不再抛出任何错误，尽管 toJSON() JSON.stringify() 根本没有使用函数。

在这一点上，我只是绝望，只是尝试随机的东西。最终我最终使用 Object.defineProperty() 而不是直接分配给 this.toJSON:

function CustomError(message) {
    Error.call(this);
    Error.captureStackTrace(this, CustomError);
    this.message = message;
    Object.defineProperty(this, "toJSON", {
        value: () => ({
            name    : "CustomError",
            message : this.message
        })
    });

这非常有效。在严格模式下，没有错误被调用，并且 JSON.stringify() returns {"name:" CustomError", "message": "Something"} 就像我想要的那样。

所以尽管它现在可以正常工作，但我仍然想知道：

为什么这会起作用？我希望它等同于 this.toJSON = ... 但显然不是。
它应该像这样工作吗？ IE。依赖这种行为安全吗？
如果不是，我应该如何正确重写 toJSON 方法？（如果可能的话）

Answer 1

因为我注意到你在使用箭头函数，所以我假设你可以使用 ES6，这意味着你也可以使用 classes。

您可以简单地扩展 Error class。例如：

class CustomError extends Error {
    toJSON() {
        return {
            name: 'CustomError',
            message: this.message
        };
    }
}

Answer 2

Why does this work exactly?

Object.defineProperty 只是定义了一个属性（或者改变它的属性，如果它已经存在并且是可配置的）。与赋值 this.toJSON = … 不同，它不关心任何继承，也不检查是否存在可能是 setter 或 non-writable.

的继承属性

Should it work like this? I.e. is it safe to depend on this behaviour?

是的，是的。也许你甚至可以在原型上使用它。

对于您的实际用例，给定最近的 node.js 版本，使用 extends Error 的 ES6 class 以获得最佳结果。

Answer 3

如果您确实需要在 <template> 元素中使用组件或其他 React 功能，您可以通过 monkey-patching 中的一些 DOM 修复 React 以在 content 中呈现] HTMLTemplateElement 的方法。

HTMLTemplateElement.prototype.appendChild = function (child) {
  return this.content.appendChild(child);
}

HTMLTemplateElement.prototype.removeChild = function (child) {
  return this.content.removeChild(child);
}

Object.defineProperty(HTMLTemplateElement.prototype, "firstChild", {
  get() {
    return this.content.firstChild;
  }
})

此后我能够在模板元素内呈现任何内容。 appendChild 和 removeChild 是强制性的，因为它将用于渲染，但如果您不使用水合作用，则可能不需要 firstChild 补丁。

Object.defineProperty 覆盖只读属性

Object.defineProperty to override read-only property

javascript

prototype

properties

node.js

ecmascript-6

Object.defineProperty 覆盖只读 属性

Object.defineProperty to override read-only property

javascript

prototype

properties

node.js

ecmascript-6

Object.defineProperty 覆盖只读属性