이벤트 위임

이벤트의 전파 방식인 버블링을 이용하여
비슷한 방식으로 여러 요소를 다뤄야 할 때,
엘리먼트 각각에 이벤트 핸들러를 할당하지 않고
공통되는 부모에 이벤트 핸들러를 할당하여 관리하는 방식

버블링을 막기 위해서 event.stopPropagation()을 사용하지 말라는 것은
stopPropagation()을 사용하면 이벤트 위임이라는 강력한 기능을 사용하지 못하게 되기 때문이다

https://ui.toast.com/weekly-pick/ko_20160826

이벤트 위임의 이점

1. 동적 엘리먼트에 대한 이벤트 처리 용이
2. 이벤트 핸들러 관리가 쉽다 - 유지보수, 가독성
3. 메모리 사용량이 줄어든다
4. 메모리 누수의 가능성이 줄어든다

부모 엘리먼트에서 아래와 같이 조건문으로 처리해준다

document.getElementById("menu").addEventListener("click", function(e) {
  var target = e.target;
  if (target.id === "file") {
    // 파일 메뉴 동작
  } else if (target.id === "edit") {
    // 편집 메뉴 동작
  } else if (target.id === "view") {
    // 보기 메뉴 동작
  }
});