Обіцянка-цяцянка, а потім — resolve
Promise давно вже міцно увійшов до нашої практики, а багато хто з вас навіть і не знає, як це — писати усе на вкладених колбеках. Та все ж більшість із нас продовжує писати код з "обіцянками" по-старому:

const wait = (ms) =>
  new Promise((resolve) => {
    setTimeout(() => {
      resolve('Готово!');
    }, ms);
  });

await wait(1000); // Через секунду → "Готово!"

Тобто ми створюємо проміс, всередині робимо щось асинхронне, а тоді вже там же, всередині, і обробляємо результати виконання. Відверто, структурно це все ще схоже на маленький, але цілком відчутний callback-hell.

А як я вам скажу, що вже давно (і справді давно, включений до Baseline 2024 року) існує спосіб писати подібний код у більш структурованому, імперативному стилі? Дивіться:

const { promise, resolve } = Promise.withResolvers();

setTimeout(() => {
  resolve('Готово!');
}, 1000);

await promise; // → "Готово!"

Тут створюється порожній проміс і зберігаються посилання на resolve/reject. Що це дає? Місце виклику resolve/reject (наприклад, setTimeout) може бути деінде, ба більше, ви можете спокійно повертати чи передавати їх куди заманеться. Коли логіка створення проміса й обробки його результату відокремлені, код стає набагато гнучкішим.

Такий підхід згодиться, коли треба створити проміс зараз, а виконати його пізніше — наприклад, у зовнішньому евент-хендлері чи колбеках.

Цей допис точно заслужив на твою вподобайку. От і постав її просто зараз ;)

Promise.withResolvers не робить нічого революційного, по суті він є синтаксичним цукром для популярного патерна з “зовнішнім” resolve/reject:

let resolve, reject;
const promise = new Promise((res, rej) => {
  resolve = res;
  reject = rej;
});
//
resolve();

Навіщо це особисто вам:
— Promise.withResolvers() — це зручний і безпечний спосіб створити проміс із доступом до resolve/reject ззовні;
— Він не привносить нової складности, навпаки просто формалізує та спрощує те, що ми й так давно робили руками;
— Дозволяє писати чистіший, зрозуміліший та структурованіший код, особливо у випадках, де логіка розірвана в часі.

Мені особисто дуже зайшло використовувати withResolvers, хоча б через дещо інший спосіб організації коду.

MDN

А ви як? Спробували би це у своєму проді? Чи може встигли вже? Розкажіть в коментарях!

@babichdev

***
👋 Збір на РЕБ для 109 ОГШБ 10 ОГШБр «Едельвейс» триває! Ми вже подолали першу позначку в 20 000 і впевнено йдемо до 50 000 грн! Кожні 50 грн — шанс виграти подарунок і допомогти ЗСУ.