javascript - 为什么 Typescript 认为 async/await 返回一个包含在 promise 中的值？

Question

我想将 promise 链重构为 async/await，但 Typescript 提示输入。

TS2322:Type 'IHttpPromiseCallbackArg< IResp >' is not assignable to type 'IResp'...

我以为 await 会返回一个常规值，而不是一个 promise。我错了吗？如果是这样，我如何分配类型以便编译所需的代码？

我认为 await 会返回与 .then 回调中的第一个参数相同的值。我错了吗？

旧代码:

handleSubmit(form) {
    const params = this.getParams(form);

    this.myAsyncRequest(params)
       .then((resp:IResp) => this.processResp(resp))
       .catch((e:IServerError) => this.handleError(e));
 }

所需的新代码:

async handleSubmit(form) {
    const params = this.getParams(form);

    try {
        const resp:IResp = await this.myAsyncRequest(params); //typing error with "const resp:IResp"
        this.processResp(resp);
    } catch (e:IServerError) {
        this.handleError(e);
    }
}

如果我删除 myAsyncRequest 中的返回类型，所需的代码仍然会中断；我猜 Typescript 是直接从 AngularJS 库中推断出来的。

myAsyncRequest(params:IParams):IHttpPromise<IResp> {
    return $http.post('blah', data);
}

如果我从 const resp 声明中删除“IResp”，processResponse 会提示 IHttp< IResp> 不等于 IResp...

processResp(resp:IResp) {
    //do stuff
}

Answer 1

您的问题“我认为 await 会返回与 .then 回调中的第一个参数相同的值。我错了吗？”。

不，你是绝对正确的。但是你对 .then 回调中的第一个参数是什么是错误的。

你定义myAsyncRequest返回 IHttpPromise<IResp> .但是IHttpPromise<T>定义为继承 IPromise以下方式:

type IHttpPromise<T> = IPromise<IHttpPromiseCallbackArg<T>>;

所以，一个 IHttpPromise<T>是一个返回 IHttpPromiseCallbackArg<T> 的 promise 返回 T 类型的实际数据在data IHttpPromiseCallbackArg<T> 的属性(property).

因此，我们在问题中看到的旧代码变体:

handleSubmit(form) {
    const params = this.getParams(form);

    this.myAsyncRequest(params)
       .then((resp:IResp) => this.processResp(resp))
       .catch((e:IServerError) => this.handleError(e));
 }

当 myAsyncRequest 时，实际上不应该在 TypeScript 中没有错误地编译被定义为返回 IHttpPromise .

如何解决这个问题:

async handleSubmit(form) {
    const params = this.getParams(form);

    try {
        const httpResp:IHttpPromiseCallbackArg<IResp> = await this.myAsyncRequest(params); 
        const resp: IResp = httpResp.data;
        this.processResp(resp);
    } catch (e:IServerError) {
        this.handleError(e);
    }
}

---

注意:在 angular 的最新类型定义中，类型 IHttpPromiseCallbackArg<T>实际上叫做IHttpResponse<T> .

也许在你的代码中，你定义了IResp作为IHttpResponse<Something> ？那么你只是与旧名称发生冲突IHttpPromiseCallbackArg .然后从使用新名称的 DefinitelyTyped 获取最新的类型定义。而且您还必须更改 myAsyncRequest 的定义到:

myAsyncRequest(params:IParams):IHttpPromise<Something> {