programing

Typescript-확장 오류 클래스

shortcode 2021. 1. 19. 07:33
반응형

Typescript-확장 오류 클래스


"Error"대신 콘솔에 "CustomError"클래스 이름이 인쇄 된 사용자 지정 오류를 던지려고하는데 성공하지 못했습니다.

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 프로토 타입을 엉망으로 만들지 않고)?


Typescript 버전 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의 내장 클래스 Errorthis호출 할 때 생성 할 객체 (예 :) 를 새롭고 다른 객체 로 전환하여 프로토 타입 체인을 끊고 super새 객체에 예상되는 프로토 타입 체인이없는 경우, 즉 인스턴스라는 것입니다. 의 Error하지 않는 CustomError.

이 문제는 Typescript 2.2부터 지원되는 'new.target'을 사용하여 우아하게 해결할 수 있습니다. 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 VeryCustomErrorinstanceof CustomError

See also: https://github.com/Microsoft/TypeScript/issues/13965#issuecomment-278570200


It works correctly in ES2015 (https://jsfiddle.net/x40n2gyr/). Most likely, the problem is that the TypeScript compiler is transpiling to ES5, and Error cannot be correctly subclassed using only ES5 features; it can only be correctly subclassed using ES2015 and above features (class or, more obscurely, Reflect.construct). This is because when you call Error as a function (rather than via new or, in ES2015, super or Reflect.construct), it ignores this and creates a new Error.

You'll probably have to live with the imperfect output until you can target ES2015 or higher...


I ran into the same problem in my typescript project a few days ago. To make it work, I use the implementation from MDN using only vanilla js. So your error would look something like the following:

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

It doesn't seem to work in SO code snippet, but it does in the chrome console and in my typescript project:

enter image description here

ReferenceURL : https://stackoverflow.com/questions/41102060/typescript-extending-error-class

반응형