이벤트(Event)란?

이벤트는 사용자가 웹 페이지와 상호작용할 때 발생하는 신호입니다. 클릭, 키보드 입력, 마우스 이동, 스크롤, 페이지 로드 등 모든 행동이 이벤트가 될 수 있어요. JavaScript는 이 이벤트를 '듣고(listen)' 있다가, 이벤트가 발생하면 미리 정해둔 동작을 실행합니다. 예를 들어 '좋아요' 버튼을 클릭하면 하트가 빨갛게 채워지죠? 이건 click 이벤트가 발생했을 때, JavaScript가 하트의 색상을 바꾸는 함수를 실행한 거예요. 코드로는 button.addEventListener('click', function() { ... }) 이런 식으로 작성합니다. '이 버튼에 클릭 이벤트가 발생하면 이 함수를 실행해줘'라는 뜻이죠. 이벤트에는 여러 종류가 있습니다. click(클릭), submit(폼 제출), keydown(키 누름), scroll(스크롤), mouseover(마우스 올림), load(페이지 로드 완료) 등등요. 실무에서는 이벤트를 적절히 조합해서 인터랙티브한 UI를 만듭니다. 예를 들어 검색창에 입력할 때마다 자동완성이 뜨는 건, keyup 이벤트를 듣고 있다가 서버에 검색어를 요청하는 거예요. 이벤트 버블링도 중요한 개념입니다. 자식 요소에서 발생한 이벤트가 부모 요소로 전파되는 현상이에요. 예를 들어 버튼을 클릭하면, 버튼의 클릭 이벤트뿐 아니라 버튼을 감싸고 있는 div의 클릭 이벤트도 발생할 수 있어요. 이걸 제어하려면 stopPropagation() 같은 메서드를 씁니다.