From da78a9e329e272dedb2400b79a3bdeebff387d47 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:17 -0500 Subject: initial commit --- files/ko/web/api/eventtarget/index.html | 133 ++++++++++++++++++++++++++++++++ 1 file changed, 133 insertions(+) create mode 100644 files/ko/web/api/eventtarget/index.html (limited to 'files/ko/web/api/eventtarget/index.html') diff --git a/files/ko/web/api/eventtarget/index.html b/files/ko/web/api/eventtarget/index.html new file mode 100644 index 0000000000..5addf5b9d6 --- /dev/null +++ b/files/ko/web/api/eventtarget/index.html @@ -0,0 +1,133 @@ +--- +title: EventTarget +slug: Web/API/EventTarget +tags: + - API + - DOM + - DOM Events + - EventTarget + - Interface + - Reference +translation_of: Web/API/EventTarget +--- +
{{ApiRef("DOM Events")}}
+ +

EventTarget은 이벤트를 받을 수 있으며, 이벤트에 대한 수신기(listener)를 가질 수 있는 객체가 구현하는 DOM 인터페이스입니다.

+ +

{{domxref("Element")}}, {{domxref("document")}} 및 {{domxref("window")}}가 가장 흔한 이벤트 대상이지만, 다른 객체, 예컨대 {{domxref("XMLHttpRequest")}}, {{domxref("AudioNode")}}, {{domxref("AudioContext")}} 등 역시 이벤트 대상이 될 수 있습니다.

+ +

많은 이벤트 대상(요소, 문서, 창, ...)은 onevent 속성과 특성을 사용한 이벤트 처리기 등록도 지원합니다.

+ +

{{InheritanceDiagram}}

+ +

생성자

+ +
+
{{domxref("EventTarget.EventTarget()", "EventTarget()")}}
+
새로운 EventTarget 객체 인스턴스를 생성합니다.
+
+ +

메서드

+ +
+
{{domxref("EventTarget.addEventListener()")}}
+
EventTarget에 특정 이벤트 유형의 이벤트 처리기를 등록합니다.
+
{{domxref("EventTarget.removeEventListener()")}}
+
EventTarget에서 주어진 이벤트 수신기를 제거합니다.
+
{{domxref("EventTarget.dispatchEvent()")}}
+
EventTarget에 이벤트를 디스패치 합니다.
+
+ + + +

예제

+ +

간단한 EventTarget 구현

+ +
var EventTarget = function() {
+  this.listeners = {};
+};
+
+EventTarget.prototype.listeners = null;
+EventTarget.prototype.addEventListener = function(type, callback) {
+  if (!(type in this.listeners)) {
+    this.listeners[type] = [];
+  }
+  this.listeners[type].push(callback);
+};
+
+EventTarget.prototype.removeEventListener = function(type, callback) {
+  if (!(type in this.listeners)) {
+    return;
+  }
+  var stack = this.listeners[type];
+  for (var i = 0, l = stack.length; i < l; i++) {
+    if (stack[i] === callback){
+      stack.splice(i, 1);
+      return;
+    }
+  }
+};
+
+EventTarget.prototype.dispatchEvent = function(event) {
+  if (!(event.type in this.listeners)) {
+    return true;
+  }
+  var stack = this.listeners[event.type].slice();
+
+  for (var i = 0, l = stack.length; i < l; i++) {
+    stack[i].call(this, event);
+  }
+  return !event.defaultPrevented;
+};
+
+ +

명세

+ + + + + + + + + + + + + + + + + + + + + + + + +
명세상태설명
{{SpecName('DOM WHATWG', '#interface-eventtarget', 'EventTarget')}}{{Spec2('DOM WHATWG')}}변화 없음.
{{SpecName('DOM3 Events', 'DOM3-Events.html#interface-EventTarget', 'EventTarget')}}{{Spec2('DOM3 Events')}}매개변수 약간이 이제 선택사항(listener) 또는 null 값을 받아들임(useCapture).
{{SpecName('DOM2 Events', 'events.html#Events-EventTarget', 'EventTarget')}}{{Spec2('DOM2 Events')}}초기 정의.
+ +

브라우저 호환성

+ + + +

{{Compat("api.EventTarget")}}

+ +

같이 보기

+ + -- cgit v1.2.3-54-g00ecf