Promises & Promise Combinators

8. Practice Problems

1. Create a Promise that resolves to "hi" after 50 ms.
   ✨ Show Answer

   a1.js

   new Promise(r => setTimeout(() => r("hi"), 50)).then(console.log);

   Run Copy

2. Chain three increments using .then.
   ✨ Show Answer

   a2.js

   Promise.resolve(0)
       .then(n => n + 1)
       .then(n => n + 1)
       .then(n => n + 1)
       .then(console.log);

   Run Copy

3. Catch a rejected Promise and print its message.
   ✨ Show Answer

   a3.js

   Promise.reject(new Error("oops"))
       .catch(e => console.log("caught:", e.message));

   Run Copy

4. Use Promise.all to await three timers.
   ✨ Show Answer

   a4.js

   const wait = ms => new Promise(r => setTimeout(() => r(ms), ms));
   Promise.all([wait(10), wait(20), wait(30)]).then(console.log);

   Run Copy

5. Use Promise.allSettled with one rejected Promise.
   ✨ Show Answer

   a5.js

   Promise.allSettled([
       Promise.resolve(1),
       Promise.reject("x"),
       Promise.resolve(3)
   ]).then(console.log);

   Run Copy

6. Race two timers and print the faster.
   ✨ Show Answer

   a6.js

   const wait = (v, ms) => new Promise(r => setTimeout(() => r(v), ms));
   Promise.race([wait("slow", 200), wait("fast", 20)]).then(console.log);

   Run Copy

7. Use Promise.any with one fail and one success.
   ✨ Show Answer

   a7.js

   Promise.any([
       Promise.reject("x"),
       Promise.resolve("ok")
   ]).then(console.log);

   Run Copy

8. Build a delay(ms) Promise utility.
   ✨ Show Answer

   a8.js

   const delay = ms => new Promise(r => setTimeout(r, ms));
   delay(30).then(() => console.log("after 30ms"));

   Run Copy

9. Implement timeout(promise, ms) that rejects if the inner promise is too slow.
   ✨ Show Answer

   a9.js

   const timeout = (p, ms) => Promise.race([
       p,
       new Promise((_, rej) => setTimeout(() => rej(new Error("timeout")), ms))
   ]);
   
   const slow = new Promise(r => setTimeout(() => r("done"), 200));
   timeout(slow, 50).catch(e => console.log(e.message));

   Run Copy

10. Show that throwing inside a .then jumps to .catch.
    ✨ Show Answer

    a10.js

    Promise.resolve(1)
        .then(() => { throw new Error("boom"); })
        .then(() => console.log("skipped"))
        .catch(e => console.log("caught:", e.message));

    Run Copy

11. Promisify setTimeout as sleep(ms) using new Promise.
    ✨ Show Answer

    a11.js

    const sleep = ms => new Promise(r => setTimeout(r, ms));
    (async () => { await sleep(20); console.log("slept"); })();

    Run Copy

12. Run two promises in parallel and sum results.
    ✨ Show Answer

    a12.js

    const ok = (v, ms) => new Promise(r => setTimeout(() => r(v), ms));
    Promise.all([ok(10, 20), ok(15, 10)])
        .then(([a, b]) => console.log(a + b));

    Run Copy

13. Why does Promise.all fail-fast?
    ✨ Show Answer

    Answer: By design — once any input rejects, the aggregate has nothing useful to deliver, so it rejects immediately and lets you handle the failure. If you want to wait for every result and inspect successes and failures separately, use Promise.allSettled.

14. Demonstrate that resolving with a Promise unwraps it automatically.
    ✨ Show Answer

    a14.js

    const nested = Promise.resolve(Promise.resolve(42));
    nested.then(console.log);   // 42, not a Promise

    Run Copy

15. Use .finally to run cleanup whether the chain succeeds or fails.
    ✨ Show Answer

    a15.js

    Promise.resolve(1)
        .then(console.log)
        .finally(() => console.log("cleanup ok"));
    
    Promise.reject("x")
        .catch(e => console.log("err:", e))
        .finally(() => console.log("cleanup err"));

    Run Copy

16. Build a retry helper: retry(fn, n).
    ✨ Show Answer

    a16.js

    async function retry(fn, n) {
        let last;
        for (let i = 0; i < n; i++) {
            try { return await fn(); }
            catch (e) { last = e; }
        }
        throw last;
    }
    
    let i = 0;
    retry(() => ++i < 3 ? Promise.reject("nope") : Promise.resolve("ok"), 5)
        .then(console.log);

    Run Copy

17. Show the "forgot to return inside .then" bug.
    ✨ Show Answer

    a17.js

    const wait = ms => new Promise(r => setTimeout(() => r(ms), ms));
    
    // BUG — forgot return
    Promise.resolve().then(() => { wait(50); })
        .then(v => console.log("bug got:", v));   // undefined!
    
    // FIX — return the promise
    Promise.resolve().then(() => wait(50))
        .then(v => console.log("fix got:", v));

    Run Copy

18. Why is mixing then(success, fail) with .catch confusing? In one paragraph.
    ✨ Show Answer

    Answer: The two-arg form .then(success, fail) only catches rejections from the upstream Promise — it cannot catch errors thrown inside its own success handler. A trailing .catch can. Mixing both makes it ambiguous which errors land where; prefer .then(success).catch(...) or async/await + try/catch.