Tvorba klientských aplikací v JavaScriptu
Události a asynchronní zpracování - cvičení
- Webová interaktivní prezentace
- "?" zobrazí krátkou nápovědu
- Tisk jako obvykle
- Pro pokračování stiskněte mezerník
Obsah
- Události opakování
- Události klávesnice
- Handle event
- Události - stornování výchozí události
- Události - fáze průchodu události
- Zpoždění vykonávání - setTimeout, requestAnimationFrame
- Promises, async a await
Události - opakování
-
Co víte o událostech?
- addEventListener, removeEventListener, Event
Klavesnice
-
Úkol I: Napište aplikaci která bude za pomoci šipek posunovat po obrazovce kolečko.
- keyCode, code, key
Handle event
- O co jde?
- obj.handleEvent
- Upravte: předchozí kód tak, aby využíval handleEvent metodu (logujte pozici myši do console)
Stornování
- O co jde?
- e.preventDefault
- Doplňte: před proklikem cílové url zobrazte potvrzení
Fáze
- O co jde?
- e.stopPropagation, useCapture
- Doplňte: logujte pohyb myši jen mimo červený kruh
Zpozďování
- O co jde?
- setTimeout, requestAnimationFrame - ukážeme si více u canvasu
- Doplňte: nelogujte pohyb myši neustále, ale jen co 500 ms
Promise
- O co jde?
- Promise, then, fullfill, reject, resolve
- Úkol: napište asynchroní výpočet za použití setTimeout
- Úkol: napište stahovač html aktuální stránky pomocí Promise
- Úkol: napište stahovač html aktuální stránky pomocí async/await