HackMD
在監聽事件中的 this/ event
隱藏在 Handler 中的 "event"
https://ithelp.ithome.com.tw/articles/10192015
當監聽的事件發生時，瀏覽器會去執行我們透過 addEventListener() 註冊的 Event Handler (EventListener) ，也就是我們所指定的 function。
這個時候，EventListener 會去建立一個「事件物件」 (Event Object)，裡面包含了所有與這個事件有關的屬性，並且以「參數」的形式傳給我們的 Event Handler
var btn = document.getElementById('btn');
// e (Event Object)
btn.addEventListener('click', function(e){
console.log(e);
});
在事件中找回「自己」this
在 Event Handler 的 function 裡頭，若是想要對「觸發事件的元素」做某些事時，可以用 this
this 代表的會是「觸發事件的目標
console.log('target', e.target)
// 觸發事件的元素
console.log('currentTarget', e.currentTarget;
// 觸發事件的目標
console.log('this', this)
// 觸發事件的目標
換言之，e.target 其實是「觸發事件的元素」，而 this 指的是「觸發事件的目標」元素，也就是 event.currentTarget。
當然，如果在不考慮事件傳遞的情況下，this 實質上就等同於 e.target 。
