Javascript обещают, что называет "тогда" немедленно

Question

Я широко использую обещания JavaScript в разрабатываемом одностраничном приложении.В некоторых случаях мне нужно, чтобы метод then работал синхронно, если обещание уже выполнено.Для этой цели я написал собственную реализацию обещания как класс-оболочку, который прекрасно работает, но не позволяет использовать async / await.Итак, я хотел бы знать, есть ли способ иметь оба, так как мне кажется, что async / await действительно просто синтаксический сахар вокруг «затем».

Реализация пользовательского обещания уже реализует PromiseLikeИнтерфейс TypeScript, но, видимо, async / await всегда нуждается в нативном обещании.Почему?

Одна возможность, о которой я подумал, - это заменить метод «тогда» объекта реального обещания вместо того, чтобы строить свою собственную обертку сверху.Будет ли это работать?

Причина, по которой важно вызывать «затем», заключается в том, что конец цепочки обещаний является свойством компонента React, а компонент React отображает индикатор загрузки до тех пор, пока обещание не станетрешена.Без моей оболочки индикатор загрузки отображается на короткое время каждый раз при обновлении компонента, что также нарушает взаимодействие с пользователем.

Возможно, существует другой способ решения этой проблемы.Это мое первое погружение в мир JavaScript.

Я использую TypeScript и ориентируюсь на ES6.

Answer 1

но, видимо, асинхронное / ожидание всегда требует нативного обещания.

Нет, это не так.await работает с объектом, у которого есть метод .then.

Без моей оболочки индикатор загрузки отображается на короткое время каждый раз при обновлении компонента, что также нарушает взаимодействие с пользователем.

Это не вызвано ожиданием выполненных обещаний..then выполняется в микрозадаче, что означает, что если обещание действительно разрешено, .then будет выполнено сразу после того, как механизм выполнил свою текущую задачу, поэтому он будет выполнен до того, как браузер выполнит повторную обработку.

let promise = Promise.resolve(1);

setTimeout(() => { // Make sure the promise resolved
 console.log("sync");
 promise.then(() => console.log("then"));
 requestAnimationFrame(() => console.log("redraw"));
 console.log("sync end");
}, 1000);

В консоли вы увидите sync, sync end, then, redraw.