Rewrite promises to async/await when setTimeout() is used

Question

I have two functions that are written with promises:

const resolvedDelay = (value, ms) => new Promise(resolve => setTimeout(() => resolve(value),ms));
const rejectedDelay = (value, ms) => new Promise((resolve,reject) => setTimeout(() => reject(value),ms));

I try to rewrite them via async/await. This is my wrong attempt:

const resolvedDelay = async (value, ms) => setTimeout(() => value,ms); // I haven't reference to `resolve` here... :(
const rejectedDelay = async (value, ms) => setTimeout(() => {throw new Error(value)},ms);

How to do it right?

Using `async` makes only sense if you want to `await` promises inside the function. Since `setTimeout` has nothing to do with promises, you cannot make use of `async` either. The first way is the only correct way. — Felix Kling, Nov 13 '19 at 18:10
Maybe a duplicate of [Combination of async function + await + setTimeout](https://stackoverflow.com/q/33289726/218196) — Felix Kling, Nov 13 '19 at 18:11

score 1 · Answer 1 · answered Nov 13 '19 at 19:06

Usually something like this is done to convert the setTimeout into a reusable promise, which is then awaitable.

const delay = time => new Promise(res => setTimeout(res, time));

const resolvedDelay = async (value, ms) => {await delay(ms); return value;}; 
const rejectedDelay = async (value, ms) => {await delay(ms); throw Error(value);};

score 0 · Answer 2 · answered Nov 13 '19 at 18:14

This is how I would do it, I don't know of a way of doing it that would make it remain as an arrow function though.

function resolvedDelay(value, ms) {
    return new Promise(resolve => {
        setTimeout(() => {
            resolve(value);
        }, ms);
    });
}

function rejectedDelay(value, ms) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(value);
        }, ms);
    });
}

async function callFunctions() {
    const resolved = await resolvedDelay();
    const rejected = await rejectedDelay();

    // Do whatever you want with them now
}

score 0 · Accepted Answer · answered Nov 13 '19 at 18:33

You have to have a promise first in order to do anything useful with await. And, since setTimeout() doesn't create a promise and doesn't resolve or reject a promise, you HAVE to create a promise and tie it to the setTimeout() callback just like you did in your first code block.

Your second code block just calls setTimeout() and immediately returns. Wrapping it in an async makes it return a promise, but that promise is just immediately resolved when the function returns after calling setTimeout(). So, you have to be resolving or rejecting a promise when the setTimeout() callback fires and there is no way to do that with just an async function wrapper around it.

Therefore, there's no real use for async/await in creating your two functions. Your first group of functions where you manually create a promise is the way to go here.

Of course, the caller can use await with your first set of functions just fine without change.

Rewrite promises to async/await when setTimeout() is used

3 Answers3