Async / Очікуйте та Пояснення обіцянок

Оператори async/ awaitполегшують реалізацію багатьох асинхронних обіцянок. Вони також дозволяють інженерам писати більш чіткий, стислий і перевіряється код.

Щоб зрозуміти цю тему, ви повинні чітко розуміти, як працюють обіцянки.

Основний синтаксис

function slowlyResolvedPromiseFunc(string) { return new Promise(resolve => { setTimeout(() => { resolve(string); }, 5000); }); } async function doIt() { const myPromise = await slowlyResolvedPromiseFunc("foo"); console.log(myPromise); // "foo" } doIt();

Є кілька речей, на які слід звернути увагу:

  • Функція, яка охоплює awaitдекларацію, повинна включати asyncоператор. Це повідомить інтерпретатору JS, що він повинен почекати, поки Проміс буде вирішено або відхилено.
  • Під awaitчас оголошення const оператор повинен бути вбудованим.
  • Це працює rejectяк для resolve.

Вкладені обіцянки проти Async/Await

Реалізація єдиного обіцянки досить проста. На відміну від цього, ланцюгові обіцянки або створення шаблону залежності можуть створити "код спагетті".

Наступні приклади передбачають, що request-promiseбібліотека доступна як rp.

Прикуті / вкладені обіцянки

// First Promise const fooPromise = rp("//domain.com/foo"); fooPromise.then(resultFoo => { // Must wait for "foo" to resolve console.log(resultFoo); const barPromise = rp("//domain.com/bar"); const bazPromise = rp("//domain.com/baz"); return Promise.all([barPromise, bazPromise]); }).then(resultArr => { // Handle "bar" and "baz" resolutions here console.log(resultArr[0]); console.log(resultArr[1]); });

asyncта awaitобіцянки

// Wrap everything in an async function async function doItAll() { // Grab data from "foo" endpoint, but wait for resolution console.log(await rp("//domain.com/foo")); // Concurrently kick off the next two async calls, // don't wait for "bar" to kick off "baz" const barPromise = rp("//domain.com/bar"); const bazPromise = rp("//domain.com/baz"); // After both are concurrently kicked off, wait for both const barResponse = await barPromise; const bazResponse = await bazPromise; console.log(barResponse); console.log(bazResponse); } // Finally, invoke the async function doItAll().then(() => console.log('Done!'));

Переваги використання asyncі awaitповинні бути чіткими. Цей код є більш читабельним, модульним та перевіряється.

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

Обробка помилок / відхилення

Базовий блок try-catch обробляє відхилене Promise.

async function errorExample() { try { const rejectedPromise = await Promise.reject("Oh-oh!"); } catch (error) { console.log(error); // "Uh-oh!" } } errorExample();