'this'在Javascript箭头函数中未定义

Question

在Javascript事件的回调函数中，单击了this元素：

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

但是，当我使用ES6箭头功能时，this变为undefined：

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

有人可以解释一下这种行为吗？

Answer 1

调用箭头函数时，不会导致this绑定。它在封闭的词法范围内具有任何价值。在您的情况下，这意味着封闭范围中的this为undefined。