Async en Await in JavaScript zijn krachtige trefwoorden die worden gebruikt om asynchrone bewerkingen met beloften af te handelen. Asynchrone functies retourneren impliciet beloften, terwijl Await de uitvoering pauzeert totdat de belofte is opgelost. Dit vereenvoudigt asynchrone code en verbetert de leesbaarheid door deze synchroon te laten lijken.
Asynchrone functie
Deasync>
Met deze functie kunnen we op belofte gebaseerde code schrijven alsof deze synchroon is. Dit zorgt ervoor dat de uitvoeringsthread niet wordt geblokkeerd.
jtekstveld
- Afhandeling van beloftes : Asynchrone functies retourneren altijd een belofte. Als een waarde wordt geretourneerd die geen belofte is, verpakt JavaScript deze automatisch in een opgeloste belofte.
Asynchrone syntaxis
async function myFunction() { return 'Hello'; }>
Voorbeeld: Hier zullen we het basisgebruik van async in JavaScript zien.
javascript const getData = async () =>{ let data = 'Hallo wereld'; gegevens retourneren; } getData().then(data => console.log(data));>
Uitvoer
Hello World>
Wacht op trefwoord
Deawait>
trefwoord wordt gebruikt om te wachten tot een belofte wordt opgelost. Het kan alleen worden gebruikt binnen een async-blok.
- Uitvoering Pauze : Await laat de code wachten totdat de belofte een resultaat oplevert, waardoor asynchrone code schoner en beter beheersbaar is.
Syntaxis
let value = await promise;>
Voorbeeld : Dit voorbeeld toont het basisgebruik van het trefwoord await in JavaScript.
javascript const getData = async () =>{ laat y = wachten op 'Hallo wereld'; console.log(y); } console.log(1); gegevens verkrijgen(); console.log(2);>
Uitvoer
1 2 Hello World>
De asynchroon trefwoord transformeert een reguliere JavaScript-functie in een asynchrone functie, waardoor deze een belofte retourneert.
De wachten trefwoord wordt gebruikt binnen een asynchrone functie om de uitvoering ervan te onderbreken en te wachten tot een belofte is opgelost voordat verder wordt gegaan.
Java-indexvan
Async/Await-voorbeeld
Hier zullen we verschillende beloften in een methode implementeren, en vervolgens zullen we die methode gebruiken om ons resultaat weer te geven. Je kunt de JS controleren syntaxis async/wachten in het voorbeeld.
Javascript function asynchronous_operational_method() { let first_promise = new Promise((resolve, reject) =>oplossing('Hallo')); let second_promise = new Promise((oplossen, afwijzen) => { setTimeout(() => {oplossen(' techcodeview.com..'); }, 1000); }); laat combined_promise = Promise.all([eerste_promise, tweede_promise]); return combined_promise; } asynchrone functie display() {let data = wachten op asynchronous_operational_method(); console.log(gegevens); } weergave();>
Uitgang:
Java-voorbeeldcode
[ 'Hello', ' techcodeview.com..' ]>
Uitleg:
- Beloof de schepping :
- Er worden twee beloften gecreëerd: de ene wordt onmiddellijk opgelost met Hello en de andere wordt na 1 seconde opgelost met techcodeview.com...
- Beloften combineren :
- De methode Promise.all() combineert beide beloften in één enkele belofte, combined_promise.
- Asynchrone functie :
- De functie display() wordt async verklaard, wat aangeeft dat deze asynchrone bewerkingen bevat.
- In afwachting van een beloofde oplossing :
- Het trefwoord await pauzeert de uitvoering totdat combined_promise is opgelost.
- Resultaat loggen :
- De opgeloste array van combined_promise wordt vastgelegd in de console.
Opmerking
Naar oplossen En afwijzen zijn vooraf gedefinieerde argumenten door JavaScript.
- solve-functie wordt gebruikt wanneer een asynchrone taak is voltooid en retourneert het resultaat.
- De functie Afwijzen wordt gebruikt wanneer een asynchrone taak mislukt en retourneert redenen voor de fout.
Voordelen van Async en Await
- Verbeterde leesbaarheid : Met Async en Await kan asynchrone code in een synchrone stijl worden geschreven, waardoor deze gemakkelijker te lezen en te begrijpen is.
- Foutafhandeling : Het gebruik van try/catch-blokken met async/await maakt het afhandelen van fouten eenvoudig.
- Vermijdt de callback-hel : Async en Await helpen bij het vermijden van geneste callbacks en complexe belofteketens.
- Beter debuggen : Het debuggen van async/await-code is intuïtiever omdat het zich gedraagt als synchrone code.
Conclusie
Async en Await in JavaScript hebben een revolutie teweeggebracht in asynchrone programmering door code beter leesbaar en onderhoudbaar te maken. Door toe te staan dat asynchrone code in een synchrone stijl wordt geschreven, verminderen ze de complexiteit die gepaard gaat met callbacks en belofteketens. Als u async en await effectief begrijpt en gebruikt, kunt u uw JavaScript-programmeervaardigheden aanzienlijk verbeteren, waardoor het eenvoudiger wordt om asynchrone bewerkingen in uw projecten uit te voeren.
Ondersteunde browsers:
De browsers die worden ondersteund door de JS Async/Await-functie staan hieronder vermeld:
- Google Chrome 55 en hoger
- Firefox 52 en hoger
- Apple Safari 10.1 en hoger
- Opera 42 en hoger
- Rand 14 en hoger