bybence
Kapcsolat
bybence

Felfedezés

Eszközök

Academy

Blog

Hírek

Kapcsolat

Academy

JS / React / Next.js

ByBence Academy

JS / React / Next.js

14 anyag

JavaScript alapmodell

JavaScript alapokVáltozók, típusok és referenciaFunction, scope és closure
Promise, async és await
JavaScript event loopDOM és eseménykezelésJavaScript modulok – import és export
Academy

/

JS / React / Next.js

/

JavaScript alapmodell

Promise, async és await

Promise és async/await érthetően: pending/fulfilled/rejected állapot, hibakezelés és miért nem teszi az await szinkronná a teljes programot.

1 perc olvasás

Frissítve: 2026. szeptember 12.

Balogh Bence

Röviden

A Promise egy jövőbeli eredményt reprezentál, amely pending állapotból fulfilled vagy rejected állapotba kerülhet. Az `async` függvény Promise-t ad vissza, az `await` pedig az adott async függvény folytatását függeszti fel, amíg a várt eredmény rendeződik.

Mit jelent a promise, async és await?

A Promise egy jövőbeli eredményt reprezentál, amely pending állapotból fulfilled vagy rejected állapotba kerülhet. Az `async` függvény Promise-t ad vissza, az `await` pedig az adott async függvény folytatását függeszti fel, amíg a várt eredmény rendeződik.

Async folyamat

01

Call

02

Promise pending

03

I/O

04

microtask

05

continuation

Hogyan működik a gyakorlatban?

A runtime közben más feladatot továbbra is végezhet; az `await` nem blokkolja a teljes JavaScript környezetet úgy, mint egy CPU-intenzív szinkron while loop. Promise continuationök microtask queue-ba kerülnek és a call stack kiürülése után futnak.

  • Párhuzamosan indítható független requesteket ne serializálj fölöslegesen egymás utáni awaittel.
  • `Promise.all` fail-fast módon összegyűjthet több Promise-t.
  • try/catch async/await mellett rejected Promise hibát kezelhet.
  • AbortController segíthet fetch megszakításában, de az üzleti művelet szerveroldali visszavonását nem garantálja.

Gyakorlati fejlesztői szemlélet

Adatbetöltésnél rajzold fel a dependency graphot: ami független, indulhat együtt; ami előző eredményétől függ, maradjon sorrendi. Ez latencyben sokkal többet jelenthet, mint szintaktikai micro-optimalizálás.

Gyakori hibák és félreértések

  • Az `await`-et CPU-parallelizmusnak gondolni.
  • Promise-t létrehozni, majd rejectiont sehol nem kezelni.
  • Független hálózati kéréseket sorban várni.

Források és szabványok

A technikai részletekhez elsődleges szabványokat és karbantartott hivatalos dokumentációt használok. Frameworkök, böngészők és webes API-k idővel változhatnak, ezért implementálás előtt mindig ellenőrizd az aktuális dokumentációt is.

MDN JavaScript Guide

Kapcsolódó ByBence Academy

Webfejlesztés alapjaiWeb performanceJavaScript SEOWebes biztonság

Előző

Function, scope és closure

Következő

JavaScript event loop

Ezen az oldalon

Mit jelent a promise, async és await?Hogyan működik a gyakorlatban?Gyakorlati fejlesztői szemléletGyakori hibák és félreértések