instanceof为子类

Question

我正在尝试为我的应用程序创建错误处理。我创建了一个名为AppError的基类。我有扩展AppError类的特定错误类。例如错误状态400的BadInput类。我使用 instanceof 来识别对象类。但是，即使我正在创建BadInput类的实例， obj instanceof BadInput 总是返回false。我的代码如下：

  

应用-error.ts

export class AppError {
    constructor (public originalError?: any) {
        console.log(originalError);
    }
}

  

坏input.ts

import { AppError } from './app-error';

export class BadInput extends AppError {
    constructor (public originalError?: any) {
        super(originalError);
    }
}

  

数据-service.service.ts

// import statements

export class DataService {
  private _baseUrl = 'dummy.com'

  constructor(private _http: Http) {}

  get http() {
    return this._http;
  }

  makePostRequest (urlSubpath: string, body: Object) {
    return this._http.post(this._baseUrl + urlSubpath, JSON.stringify(body), this.getOptions())
              .map (response => response.json());
  }

  protected handleError(error: Response) {
    if (error.status === 400) {
      return Observable.throw (new BadInput (error.json()));
    } else if (error.status === 404) {
      return Observable.throw (new NotFoundError ());
    } else if (error.status === 500) {
      console.log ('in 500 handling...');
      return Observable.throw (new BadInput (error.json()));
    }

    return Observable.throw (new AppError (error.json()));
  }
}

请在 handleError（）<中注意 行返回Observable.throw（新BadInput（error.json（）））; 几次/ EM>

  

otp.service.ts

// import statements
@Injectable()
export class OtpCheckerService extends DataService {

  constructor(http: Http) {
    super(http);
   }

   check(body) {
    return super.makePostRequest('Api/VerifyMobile', body)
      .catch(this.handleError);
  }
}

  

otp.component.ts

// Only providing required code

submit() {
    const body = {
      UserId: this._user.id,
      OTP: this.otp.value
    };

    this._spinner.show ();

    this._otpCheckerService.check(body).subscribe(
      response => {
        this._user.isSignedIn = true;
        this._router.navigate(['/checkout']);
      },
      (error: AppError) => {
        this._spinner.hide();
        if (error instanceof BadInput) {
          console.log ('handling bad input..');
          this._isOtpWrong = true;
        } else {
          throw error;
        }
      },
      () => {
        this._spinner.hide();
      }
    );
  }

为了简洁，我跳过了一些代码，但如果你需要，我可以把代码放在这里。

  

更新1：

我在otp.component.ts中修改了 submit（），看看我的全局错误处理程序是否涉及到此。更新的提交方法如下所示：

submit() {
    const body = {
      UserId: this._user.id,
      OTP: this.otp.value
    };

    this._spinner.show ();

    this._otpCheckerService.check(body).subscribe(
      response => {
        this._user.isSignedIn = true;
        this._router.navigate(['/checkout']);
      },
      (error: AppError) => {
        this._spinner.hide();
        if (error instanceof BadInput) {
          console.log ('handling bad input..');
          this._isOtpWrong = true;
        } else if (error instanceof AppError) {
          console.log ('handling app error..');
        } else {
          throw error;
        }
      },
      () => {
        this._spinner.hide();
      }
    );
  }

请注意我正在检查 错误实例AppError 。这也会返回false。并且全局错误处理程序处理错误。我的全局错误处理程序如下所示：

import { ErrorHandler } from '@angular/core';

export class AppErrorHandler implements ErrorHandler {
    handleError(error: any): void {
        console.log(error);
        alert ('Sorry. An unexpected error occured. Our engineers are fixing it.');
    }
}

Answer 1

你有。显然，你得到的不是JSON（至少在出现错误时），因此，handleError方法在调用error.json()时会引发异常。该异常（Error对象）是您在订阅中获得的，而不是您的Error个类。

我建议做这样的事情：

protected handleError(error: Response) {
    try {
        if (error.status === 400) {
            return Observable.throw (new BadInput (error.json()));
        } else if (error.status === 404) {
            return Observable.throw (new NotFoundError ());
        } else if (error.status === 500) {
            console.log ('in 500 handling...');
            return Observable.throw (new BadInput (error.json()));
        }

        return Observable.throw (new AppError (error.json()));
    } catch (err) {
        return Observable.throw(new AppError({
           message: err.message,
           stackTrace: err.stack
        }
    }
}

通过这种方式，您可以捕获任何异常，并接收您的某个类，如果这是您想要的。无论如何，现在你知道你的类型检查失败的原因了。