在打字稿中检查API响应的类型

时间:2020-03-18 12:27:19

标签: javascript typescript async-await

我很好奇,当您期望某个特定类型作为来自fetch / Axios / etc的响应并且其响应属于另一种类型时,会发生什么。我可以检测到不匹配吗?

interface HttpResponse<T> extends Response {
  parsedBody?: T;
}
export async function http<T>( request: RequestInfo ): Promise<HttpResponse<T>> {
  const response: HttpResponse<T> = await fetch( request );
  response.parsedBody = await response.json();
  return response;
}

// example consuming code
const response = await http<number>(
  "https://thisURLdoesNotReturnANumber"
);

代码会抛出错误吗?它会默默地过去吗?如何检测不匹配?

2 个答案:

答案 0 :(得分:0)

您的Typescript代码将被解析为Javascript,因此在运行时,当您的api获得其他类型时,类型检查将不再可用。

您不会收到任何错误。

TypeScript在开发方面只是一个很好的帮助,但遗憾的是,它不会在运行时类型验证时失败。

答案 1 :(得分:0)

在浏览器执行之前,

您的打字稿代码会转换为 javascript 。 它看起来像这样:

export async function http( request ) {
  const response = await fetch( request );
  response.parsedBody = await response.json();
  return response;
}
const response = await http("https://thisURLdoesNotReturnANumber");

如您所见,没有类型。浏览器对打字稿中定义的类型一无所知。

稍后,您可能会或可能不会收到运行时错误。要尽早抛出,您需要在http<T>()函数内部自己实现运行时检查。
或者,您可以使用第三方库来完成这项工作。有很多。