TypeScript: clase de error extensible

Estoy tratando de lanzar un error personalizado con mi nombre de clase "CustomError" impreso en la consola en lugar de "Error", sin éxito:

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

La salida es Uncaught Error: Lorem "foo" ipsum dolor.

Lo que espero: Uncaught CustomError: Lorem "foo" ipsum dolor.

Me pregunto si eso se puede hacer usando solo TS (sin jugar con los prototipos JS).

¿Está utilizando mecanografiado la versión 2.1 y transpilando a ES5? Consulte esta sección de la página de cambios importantes para ver posibles problemas y soluciones: https://github.com/Microsoft/TypeScript-wiki/blob/master/Breaking-Changes.md#extending-built-ins-like-error-array- y el mapa puede que ya no funcione

El bit relevante:

Como recomendación, puede ajustar manualmente el prototipo inmediatamente después de cualquier llamada de super (...).

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

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

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

Sin embargo, cualquier subclase de FooError también tendrá que configurar manualmente el prototipo. Para los tiempos de ejecución que no son compatibles con Object.setPrototypeOf, es posible que pueda usar __proto__.

Desafortunadamente, estas soluciones no funcionarán en Internet Explorer 10 y versiones anteriores. Uno puede copiar manualmente métodos del prototipo en la instancia en sí (es decir, FooError.prototype en esta), pero la cadena del prototipo en sí no se puede arreglar.

El problema es que la clase incorporada de Javascript Errorrompe la cadena de prototipos al cambiar el objeto que se va a construir (es decir this) a un objeto nuevo y diferente, cuando llama supery ese nuevo objeto no tiene la cadena de prototipos esperada, es decir, es una instancia de Errorno de CustomError.

Este problema se puede resolver elegantemente usando 'new.target', que es compatible desde Typecript 2.2, consulte aquí: 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; } 
  }
}

El uso new.targettiene la ventaja de que no tiene que codificar el prototipo, como algunas otras respuestas propuestas aquí. De nuevo, eso tiene la ventaja de que las clases heredadas CustomErrortambién obtendrán automáticamente la cadena de prototipos correcta.

Si tuviera que codificar el prototipo (p Object.setPrototype(this, CustomError.prototype). Ej. ), El CustomErrormismo tendría una cadena de prototipos en funcionamiento, pero cualquier clase heredada CustomErrorse rompería, p. Ej., Las instancias de a class VeryCustomError < CustomErrorno serían las instanceof VeryCustomErroresperadas, sino únicamente instanceof CustomError.

Véase también: https://github.com/Microsoft/TypeScript/issues/13965#issuecomment-278570200

Funciona correctamente en ES2015 ( https://jsfiddle.net/x40n2gyr/ ). Lo más probable es que el problema sea que el compilador de TypeScript se está transfiriendo a ES5 y Errorno se puede subclasificar correctamente utilizando solo las funciones de ES5; solo se puede subclasificar correctamente usando ES2015 y características superiores ( classo, de manera más oscura, Reflect.construct). Esto se debe a que cuando llama Errorcomo una función (en lugar de a través de newo, en ES2015, supero Reflect.construct), ignora thisy crea un nuevo Error .

Probablemente tendrá que vivir con la salida imperfecta hasta que pueda apuntar a ES2015 o superior ...

A partir de TypeScript 2.2 se puede hacer a través de 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
    }
}

Me encontré con el mismo problema en mi proyecto de mecanografiado hace unos días. Para que funcione, utilizo la implementación de MDN usando solo vanilla js. Entonces, su error se vería como lo siguiente:

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');

No parece funcionar en el fragmento de código SO, pero sí en la consola de Chrome y en mi proyecto de mecanografiado:

Literalmente nunca publico en SO, pero mi equipo está trabajando en un proyecto de TypeScript, y necesitábamos crear muchas clases de error personalizadas, mientras también apuntábamos a es5. Habría sido increíblemente tedioso hacer la solución sugerida en cada clase de error. Pero descubrimos que podíamos tener un efecto descendente en todas las clases de error posteriores al crear una clase de error personalizada principal y tener el resto de nuestros errores en extendesa clase. Dentro de esa clase de error principal, hicimos lo siguiente para tener ese efecto descendente de actualizar el prototipo:

class MainErrorClass extends Error {
  constructor() {
    super()
    Object.setPrototypeOf(this, new.target.prototype)
  }
}

class SomeNewError extends MainErrorClass {} 

...

El uso new.target.prototypefue la clave para actualizar todas las clases de error heredadas sin necesidad de actualizar el constructor de cada una.

¡Solo espero que esto le ahorre a otra persona un dolor de cabeza en el futuro!

Prueba esto...

class CustomError extends Error { 

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

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

}

throw new CustomError('foo')