• 카테고리

    질문 & 답변
  • 세부 분야

    웹 개발

  • 해결 여부

    미해결

화살표함수를 쓰는 경우

20.08.03 07:18 작성 조회수 100

0

안녕하세요 선생님. 저같은 경우에는 해외에 거주중이고 학교에서는 화살표함수를 위주로 가르치고있어요.
그래서 강의를 보는 동안 화살표 함수를 이용해서 따라하고있었는데, 그렇게되면 (저는 정확히 모르고 구조만 알다보니) 오류가 자주 나더라구요. 이 강의에서도 console.log(this)를 찍는 경우에는 윈도우 자체를 읽는 것 같아요.

(function(){
//이벤트 위임
//ilbuni대신에 stage를 클릭해서 이벤트가 발생하도록 함.
const stage = document.querySelector('.stage');

const clickHander = (e) => {
stage.removeChild(e.target);
};

stage.addEventListener('click', clickHander)
})();

이런 경우에는 여기에서 어떻게 해야 클릭시 stage를 잡아낼 수 있을까요?

답변 1

답변을 작성해보세요.

0

네 준석님, 말씀대로 화살표함수 내부에서의 this는 window 전역객체를 가리키게 되어있어서, 이벤트핸들러로 활용할 때는 this를 사용하는 것이 불가능합니다.
대신 e.currentTarget을 사용하면, addEventListener 메서드를 호출한 객체(여기서는 stage)를 정확히 잡아낼 수 있습니다.
바로 다음 영상인 "이벤트 위임 보강 영상"을 보시면 target과 currentTarget에 대해 자세히 아실 수 있을거에요!