thisとcurrentTarget
まずevent.targetとevent.currentTargetの違い
currentTargetはイベントリスナーを登録した要素(固定)
targetは実際にイベントが起きた要素(可変)
<body> <p></p> <div></div> </body> document.body.addEventListener('click', listener);
pがクリックされる | target = p | currentTarget = body |
divがクリックされる | target = div | currentTarget = body |
三章第五回 イベントオブジェクト — JavaScript初級者から中級者になろう — uhyohyo.net
ここで、thisの話題に移る。
イベントリスナーでthisを使うとその要素を取得できる。
ただ、アロー関数を使うとthisはレシーバを指すから動かなくなる。
で、上のcurrentTargetの話題に戻ると、currentTagetもイベントリスナーを登録した要素を指すから
event.currentTarget = this
JavaScript event.currentTarget vs this - Stack Overflow
だから自分の要素を指定したいときにはthisではなくcurrentTargetを使うと
アロー関数も使えるし、thisはレシーバを指すって考えで固定できるから良いと思った。