打字稿-扩展错误类

我正在尝试在控制台中打印“ CustomError”类名称而不是“ Error”的自定义错误，但没有成功：

class CustomError extends Error { 
    constructor(message: string) {
      super(`Lorem "${message}" ipsum dolor.`);
      this.name = 'CustomError';
    }
}
throw new CustomError('foo'); 

输出为Uncaught Error: Lorem "foo" ipsum dolor。

我的期望：Uncaught CustomError: Lorem "foo" ipsum dolor。

我想知道是否可以仅使用TS来完成（不弄乱JS原型）？

您是否正在使用打字稿版本2.1，并转换为ES5？检查重大更改页面的此部分以查找可能的问题和解决方法：https : //github.com/Microsoft/TypeScript-wiki/blob/master/Breaking-Changes.md#extending-built-ins-like-error-array-并映射不再工作

相关位：

作为建议，您可以在调用任何super（...）之后立即手动调整原型。

class FooError extends Error {
    constructor(m: string) {
        super(m);

        // Set the prototype explicitly.
        Object.setPrototypeOf(this, FooError.prototype);
    }

    sayHello() {
        return "hello " + this.message;
    }
}

但是，FooError的任何子类也必须手动设置原型。对于不支持Object.setPrototypeOf的运行时，您可以改为使用__proto__。

不幸的是，这些解决方法在Internet Explorer 10及更高版本上不起作用。可以将方法从原型手动复制到实例本身（即FooError.prototype到实例），但是原型链本身无法固定。

问题在于，当您调用Javascript的内置类时Error，它通过将要构造的对象（即this）切换到新的不同对象来破坏原型链，super并且新对象没有预期的原型链，即它是一个实例。的Error不是CustomError。

使用'new.target'可以很好地解决此问题，该类型自Typescript 2.2开始受支持，请参见此处：https ://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-2.html

class CustomError extends Error {
  constructor(message?: string) {
    // 'Error' breaks prototype chain here
    super(message); 

    // restore prototype chain   
    const actualProto = new.target.prototype;

    if (Object.setPrototypeOf) { Object.setPrototypeOf(this, actualProto); } 
    else { this.__proto__ = actualProto; } 
  }
}

使用new.target具有无需对原型进行硬编码的优势，就像这里建议的其他一些答案一样。再次具有的优点是，从其继承的类CustomError也将自动获得正确的原型链。

如果您要对原型进行硬编码（例如Object.setPrototype(this, CustomError.prototype)），CustomError它本身将具有一个有效的原型链，但是继承自的任何类CustomError都将被破坏，例如a的实例class VeryCustomError < CustomError将不是instanceof VeryCustomError预期的，而仅仅是预期的instanceof CustomError。

另请参阅：https : //github.com/Microsoft/TypeScript/issues/13965#issuecomment-278570200

它可以在ES2015（https://jsfiddle.net/x40n2gyr/）中正常运行。问题很可能是TypeScript编译器正在转换为ES5，并且Error仅使用ES5功能就不能正确地将其子类化。只能使用ES2015及更高版本的功能（class或更确切地说，Reflect.construct）正确地将其分类。这是因为当您将其Error作为函数调用时（而不是通过newES2015中的superor或Reflect.construct），它会忽略this并创建一个new Error。

您可能必须忍受不完美的输出，直到可以定位到ES2015或更高版本为止。

从TypeScript 2.2开始，可以通过new.target.prototype。 https://www.typescriptlang.org/docs/handbook/release-notes/typescript-2-2.html#example

class CustomError extends Error {
    constructor(message?: string) {
        super(message); // 'Error' breaks prototype chain here
        this.name = 'CustomError';
        Object.setPrototypeOf(this, new.target.prototype); // restore prototype chain
    }
}

几天前，我在打字稿项目中遇到了相同的问题。为了使其工作，我仅使用vanilla js使用MDN的实现。因此，您的错误将类似于以下内容：

function CustomError(message) {
  this.name = 'CustomError';
  this.message = message || 'Default Message';
  this.stack = (new Error()).stack;
}
CustomError.prototype = Object.create(Error.prototype);
CustomError.prototype.constructor = CustomError;

throw new CustomError('foo');

它似乎在SO代码段中不起作用，但在chrome控制台和我的打字稿项目中却有效：

试试这个...

class CustomError extends Error { 

  constructor(message: string) {
    super(`Lorem "${message}" ipsum dolor.`)
  }

  get name() { return this.constructor.name }

}

throw new CustomError('foo')