如何在ES6 - Javascript中使用带有addeventListeners的新绑定？

ES6中引入了箭头函数（arrow function），可以简化函数的书写和绑定this的方式。在使用箭头函数时，可以通过新绑定（new binding）来绑定this。

在ES6中，可以使用箭头函数和addeventListener方法结合来实现新绑定。具体步骤如下：

1. 首先，使用addeventListener方法为元素添加事件监听器。例如，为一个按钮元素添加点击事件监听器：

const button = document.querySelector('button');
button.addEventListener('click', () => {
  // 事件处理逻辑
});

1. 在箭头函数中，可以直接使用this关键字来引用当前的元素，而无需使用bind方法来绑定this。例如，在点击事件处理逻辑中，可以通过this来引用按钮元素：

const button = document.querySelector('button');
button.addEventListener('click', () => {
  console.log(this); // 输出按钮元素
});

1. 在箭头函数中，this的值是在定义函数时确定的，而不是在运行时确定的。这意味着箭头函数中的this始终指向定义时的上下文，而不会受到调用方式的影响。例如，在上述代码中，无论是通过点击按钮还是通过其他方式触发点击事件，箭头函数中的this始终指向按钮元素。

需要注意的是，箭头函数不能用作构造函数，因此不能使用new关键字来创建实例。

推荐的腾讯云相关产品：无

参考链接：

• MDN Web 文档：箭头函数
• ES6 系列之箭头函数