JavaScript 이벤트 모델의 비동기성
addEventListener 메서드를 사용하여
페이지 요소에서 발생하는 다양한 이벤트에
구독할 수 있다는 것을 알고 계실 것입니다.
예를 들어, 변수 elem에 저장된 링크인
특정 요소에 대한 클릭 이벤트를 구독해 보겠습니다:
elem.addEventListener('click', function() {
console.log('1');
});
console.log('2');
주어진 코드에서는 먼저 두 번째 콘솔 출력이 실행됩니다. 그렇다면 첫 번째는 언제 실행될까요? 언젠가: 이 코드의 실행은 요소 클릭이라는 이벤트 발생을 기다리고 있습니다. 이것이 발생하자마자 우리의 코드가 실행될 것입니다.
콘솔에 숫자가 어떤 순서로 출력될지 설명해 보세요:
elem1.addEventListener('click', function() {
console.log('1');
});
elem2.addEventListener('click', function() {
console.log('2');
});