Почему Typescript считает, что async / await возвращает значение, заключенное в обещание?

Ваш вопрос «Я думал, что await вернет то же значение, что и первый аргумент в обратном вызове .then. Я ошибаюсь?».

Нет, ты абсолютно прав. Но вы ошибаетесь насчет первого аргумента обратного вызова .then.

Вы определяете myAsyncRequest для возврата IHttpPromise<IResp>. Но IHttpPromise<T> определяется как наследование IPromise следующим образом:

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

Итак, IHttpPromise<T> - это обещание, которое возвращает IHttpPromiseCallbackArg<T> обратно, где фактические данные типа T находятся в свойстве data IHttpPromiseCallbackArg<T>.

Итак, старый вариант кода, который мы видим в вопросе:

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

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

на самом деле не должен компилироваться без ошибок в TypeScript, когда myAsyncRequest определено для возврата 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. Затем получите новейшие определения типов от DefinentyTyped, в которых используется новое имя. И вам также придется изменить определение myAsyncRequest на:

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

Строка, содержащая await, действительно ожидает разрешенного значения, но поскольку сама функция является асинхронной (чтобы разрешить все, что ожидает), вы получаете обратно обещание.

Пример ... в приведенном ниже коде вы можете использовать x как простое число (хотя delay возвращает обещание) и снова для y - так что все, что вы ожидаете, разрешено, поэтому вы можете использовать его больше, как если бы он был синхронным .

Асинхронная функция, которая не выглядит так, как будто возвращает обещание, теперь делает это.

Это может показаться сбивающим с толку, потому что кажется, что он «инвертирует обещания», но он сдвигает then на верхний уровень (у вас могут быть асинхронные функции, вызывающие другие асинхронные функции и т. Д.).

function delay(ms: number) {
    return new Promise<number>(function(resolve) {
        setTimeout(() => {
            resolve(5);
        }, ms);
    });
}


async function asyncAwait() {
    let x = await delay(1000);
    console.log(x);

    let y = await delay(1000);
    console.log(y);

    return 'Done';
}

asyncAwait().then((result) => console.log(result));