JAVASCRIPT#25 - 자바스크립트 이벤트 전파, 버블링과 캡쳐링

AJ, I'm nothing without you. Life without you is meaningless. World without you is just pile of ashes.

1. 자바스크립트 이벤트 전파

- 이벤트가 이중구조에 의해 한 이벤트에 여러가지 함수가 동시에 불려오는 상황을 이벤트 전파라고 한다.

2. 자바스크립트 이벤트 객체

- 이벤트관련 객체로 이벤트 발생시 여러가지 값들을 반환할 수 있는 내장객체이다.

- 이벤트 객체는 "e" 라는 소문자 하나로 표현하며 여느 다른 객체처럼 . 이후 원하는 프로퍼티값을 입력하면 해당 값을 반환한다.

3. 자바스크립트 이벤트 버블링

- 자바스크립트 이벤트 버블링이란 이벤트 전파의 타입중 하나로 발생한 지점에서부터 시작해서 부모 노드로 진행한다.

- addEventListener 함수의 마지막값에 false를 넣어주면 캡쳐링 방식으로 처리한다. (기본값)

4. 자바스크립트 이벤트 캡쳐링

- 자바스크립트 이벤트 캡쳐링이란 이벤트 전파의 타입줭 하나로 부모 노드로부터 시작해서 발생한 지점로 진행한다. 

- addEventListener 함수의 마지막값에 true를 넣어주면 캡쳐링 방식으로 처리한다.

자바스크립트 이벤트 전파 예제

이벤트 전파.zip

눈여겨 봐야할 점

1) 이벤트 오브젝트 e

2) 이벤트 오브젝트 e의 프로퍼티인 eventPhase

3) 사용자정의 오브젝트인 wutphase 배열-switch 형태의 오브젝트.