Async / Várjon és ígéretek magyarázata

Programozás

A async/ awaitoperátorok megkönnyítik számos aszinkron ígéret végrehajtását. Lehetővé teszik a mérnökök számára, hogy világosabb, tömörebb, tesztelhetőbb kódot írjanak.

Ennek a témának a megértéséhez alaposan meg kell ismernie az ígéretek működését.

Alapszintaktika

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

Néhány dolgot érdemes megjegyezni:

  • A awaitnyilatkozatot magában foglaló függvénynek tartalmaznia kell az asyncoperátort. Ez elmondja a JS tolmácsnak, hogy meg kell várnia, amíg az Ígéret megoldásra kerül vagy elutasításra kerül.
  • Az awaitoperátornak inline-nak kell lennie a const deklaráció során.
  • Ez rejectugyanúgy működik, mint resolve.

Beágyazott Promises vs. Async/Await

Egyetlen ígéret végrehajtása meglehetősen egyszerű. Ezzel szemben a Láncolt ígéretek vagy egy függőségi minta létrehozása „spagetti kódot” eredményezhet.

A következő példák feltételezik, hogy a request-promisekönyvtár a következő néven érhető el rp.

Láncolt / beágyazott ígéretek

// 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és awaitÍgéretek

// 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!'));

A használat előnyei asyncés awaitegyértelműek. Ez a kód olvashatóbb, modulárisabb és tesztelhetőbb.

Meg kell jegyezni, hogy annak ellenére, hogy van egyidejűleg a párhuzamosság, az alapul szolgáló számítási folyamat megegyezik az előző példával.

A hibák kezelése / elutasítás

Egy alap próbálkozási blokk kezeli az elutasított ígéretet.

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