-
질문 & 답변
카테고리
-
세부 분야
프로그래밍 언어
-
해결 여부
해결됨
addEventListener 콜백함수의 인자 확인법??
20.01.21 21:36 작성 조회수 361
0
<div class="ttt1"></div>
<script>
const test = document.querySelector(".ttt1");
function testFunc(x, y, z) {
console.log(this, x, y, z);
}
test.addEventListener("click", testFunc);
</script>
MDN 보니까
콜백함수 내에서 this 가 무얼 가리키고,
정해져있는 인자가 무엇무엇인지 에 대한게 안보이더라구요.
(물론 강의에서 설명해주신것으로 이해는 했습니다.)
혹시 어디서 볼수있을까요?
답변을 작성해보세요.
1
정재남
지식공유자2020.01.22
https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener#The_event_listener_callback
https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener
위 첫번째 링크(영어)에는 hashtag(The event listener callback)가 걸려있어 바로 확인 가능한 반면,
두번째 링크(한국어)에는 hashtag가 빠져있어서 위치 찾기가 쉽진 않네요.
어쨌든 한국어 버전에서는 '이벤트 리스너 콜백' 파트에서 첫번째 인자로 event객체를 받는다는 것이 명시되어 있습니다.
"즉, 콜백은 단일 매개 변수를 허용합니다: 발생한 이벤트를 설명하는 Event에 기반한 객체이며, 아무것도 반환하지 않습니다."
또한 this에 관해서는, 같은 페이지에서
'The value of this within the handler' (영어)
'핸들러 내부의 this 값' (한국어)
파트를 살펴보시면 됩니다.
"addEventListener() 를 사용하여 핸들러 함수를 요소에 연결하면, 핸들러 내부의 this 값은 요소에 대한 참조입니다. 이것은 핸들러에 전달 된 이벤트 인수(아규먼트)의 currentTarget 속성(프로퍼티)값과 같습니다."
답변 1