Tapahtumamallin asynkronisuus JavaScriptissä
Tiedät, että addEventListener-metodilla
voit tilata erilaisia tapahtumia,
jotka tapahtuvat sivun elementeissä. Esimerkiksi,
tilataan klikkaustapahtuma jollekkin elementille,
johon linkki tallennetaan muuttujaan elem:
elem.addEventListener('click', function() {
console.log('1');
});
console.log('2');
Esitetyssä koodissa toinen konsoliin tulostus suoritetaan ensin. Milloin ensimmäinen suoritetaan? Joskus: tämän koodin suoritus odottaa tapahtunutta tapahtumaa - klikkausta elementtiin. Heti kun tämä tapahtuu, koodimme suoritetaan.
Kerro, missä järjestyksessä numerot tulostuvat konsoliin:
elem1.addEventListener('click', function() {
console.log('1');
});
elem2.addEventListener('click', function() {
console.log('2');
});