Get value from setTimout inside a forEach

Question

I have now spent several hours here reading through the solutions to this problem, like this: Get return value from setTimeout

But I can't find any solution for my problem to get the removeCount value. I also tried to add a Promise, but I don't know how to do it with the increment.

async function removeNeedlessNotifications(mutations) {
    const getResult = async () => {
        let removeCount = 0;
        mutations.forEach((v) =>
            v.addedNodes.forEach((v, i) =>
                setTimeout(() => {
                    if (notificationFilter(v)) {
                        v.querySelector("div.activity-remove.js-remove").click();
                        removeCount++;
                    }
                }, i * 100)
            )
        );
        return removeCount;
    };

    return await getResult();
}

score 1 · Accepted Answer · answered Aug 14 '21 at 19:10

1

Use two for loops instead so you can await inside, and it becomes trivial:

async function removeNeedlessNotifications(mutations) {
    let removeCount = 0;
    for (const mutation of mutations) {
        for (const node of mutation.addedNodes) {
            await new Promise(r => setTimeout(r, 100));
            if (notificationFilter(node)) {
                node.querySelector("div.activity-remove.js-remove").click();
                removeCount++;
            }
        }
    }
    return removeCount;
}

This will return a Promise that resolves to the number of divs clicked.

answered Aug 14 '21 at 19:10

CertainPerformance

356,069
52
309
320

Very interesting. But now I have the problem that it returns only a Promise. For that I would have used the following: `const notificationsObserver = new MutationObserver((mutations) => { const removedNeedlessNotifications = await removeNeedlessNotifications(mutations); }` But I only get the text back. I'm so bad with async/await :( – edass Aug 15 '21 at 13:31
1

You need to consume the Promise. Either make the callback async so you can await it, or call `.then` on the Promise. – CertainPerformance Aug 15 '21 at 13:41
Little question is there a difference between `await new Promise(resolve => setTimeout(resolve, 100));` and `await new Promise((resolve) => setTimeout(resolve, 100));`? – edass Aug 16 '21 at 14:18
1

No, those are exactly the same. Parentheses are optional around arrow function arguments when there's exactly one argument. – CertainPerformance Aug 16 '21 at 14:19
Just to see how to solve the problem with async/await, I did it like this: `async () => { console.log(await removeNeedlessNotifications(mutations)); };` but I didn't get something back. What is missing? – edass Aug 16 '21 at 15:30
This way it works: `(async () => { console.log(await removeNeedlessNotifications(mutations)); })();` But don't know why and don't know how to search this kind of syntax. Don't want to post a duplicate question. – edass Aug 16 '21 at 18:45
You don't need to make an async IIFE (which takes a bit of annoying syntax noise), all you need is to consume the Promise. `removeNeedlessNotifications(mutations).then(console.log)` should work – CertainPerformance Aug 16 '21 at 18:48
at CertainPerformance: That was my first solution. But in articles and videos about Promise and async/await it was often said that async/await was the syntactically superior version of the .then solution. – edass Aug 16 '21 at 19:16
It seems that in my first version my function was just not executed. I wonder if there is a useful case for this. At least my IDE did not criticize the syntax. – edass Aug 16 '21 at 19:27
1

Async functions are good when you have *at least two* Promises to consume, IMO. Otherwise, I think using `.then` makes the syntax easier. – CertainPerformance Aug 16 '21 at 20:13

Get value from setTimout inside a forEach

1 Answers1