'；这'；在Javascript箭头函数中未定义

在Javascript事件的回调函数中，

单击此

元素：

  document.querySelector('#my-element').addEventListener('click', function() {
    console.log(this);  // <div id="my-element">
  });

---

有人能给我解释一下这种行为吗？

箭头函数在调用时，不会导致

这个

被绑定。它将具有它在封闭的词法作用域中的任何值。在您的例子中，这意味着

这个

在封闭范围内是

未定义的

箭头函数具有词法

这个

绑定。在这方面还有很多其他的，还有一个复制品

  document.querySelector('#my-element').addEventListener('click', () => {
    console.log(this);  // undefined
  });