Question

我正在使用TSLint来整理我的Angular TypeScript代码。我启用了no-unsafe-any规则，因为对于我来说，永远不要假设任何类型为any的属性都是一个好规则。

问题是该规则在我的某些代码上报告错误，除了禁用该规则外，我无法以其他任何方式修复。根据下面的规则，无效的代码示例。

public intercept(request: HttpRequest<{}>, next: HttpHandler): Observable<HttpEvent<{}>> {
  return next
    .handle(request)
    .pipe(
      catchError(error => {
        if (error && error.status === httpCodeUnauthorized) {
          // Auto logout if unathorized
          this.authenticationService.logout();
        }

        const errorMessage = (error.error && error.error.message) || error.statusText;

        return throwError(errorMessage);
      }),
    );
}

Linter在2行报告4个错误：

ERROR: /home/robert/programming/npc/gui/src/app/core/authentication/unauthorized.interceptor.ts[24, 24]: Unsafe use of expression of type 'any'.
ERROR: /home/robert/programming/npc/gui/src/app/core/authentication/unauthorized.interceptor.ts[29, 33]: Unsafe use of expression of type 'any'.
ERROR: /home/robert/programming/npc/gui/src/app/core/authentication/unauthorized.interceptor.ts[29, 48]: Unsafe use of expression of type 'any'.
ERROR: /home/robert/programming/npc/gui/src/app/core/authentication/unauthorized.interceptor.ts[29, 72]: Unsafe use of expression of type 'any'

2条有问题的行是：

if (error && error.status === httpCodeUnauthorized) {
const errorMessage = (error.error && error.error.message) || error.statusText;

问题的根源在于，赋予catchError（库函数Rxjs）的处理程序的error参数具有any类型。我知道error可以是任何类型，因此假设定义了任何属性都是不安全的，但是在实际引用它们之前，我首先要检查这些属性的存在，对我来说这是安全的。

如何/应该做些什么来说服linter / TypeScript编译器安全并通过规则？

Answer 1

对于Angular，错误应始终为HttpErrorResponse类型

catchError((error: HttpErrorResponse) => {
//...
}

也就是说，在您的代码中查看了error.error中定义为any的{{1}}，因此您可能应该使用类型保护检查并将其转换为Error对象。不需要定义HttpErrorResponse-它应该由打字稿基本类型定义。

Error

然后在

中使用它

function isError(value: any | undefined): value is Error {
  return error && ((error as Error).message !== undefined);
}

Answer 2

您有两个选择，当您知道知道error始终具有特定类型时，您可以注释该类型。如果不确定，可以使用type guard。

类型注释

使用类型注释，您可以简单地 tell 编译器，使您期望error属于某种类型。您可以使用这种方法完全避免使用类型any：

interface Error {
    status: string,
    statusText: string,
    error: { message: string | undefined } | undefined;
}

catchError((error: Error | undefined) => {
    //...
}

类型防护

只要值可以是某种类型，但不一定必须是该类型，就可以使用类型保护。类型防护将检查类型，并且在以下块中，变量将属于该检查的类型：

function isError(value: any | undefined): value is Error {
    return error && ((error as Error).status !== undefined);
}

catchError(error => {
    if (isError(error)) {
        //Inside this block, error will be of type Error
    }
}

如何解决任何不安全的任何规则？

2 个答案: