js中addEventListener注册事件用removeEventListener解绑注意事项

注册DOM事件的一种方式：addEventListener

document.addEventListener('mousemove', function() {
	console.log('执行');
});

上述事件绑定，我们是不能通过使用removeEventListener来将其解绑，因为addEventListener的第二个参数是一个匿名函数，所以removeEventListener的第二个参数是获取不到与其同名的函数；要想解绑addEventListener绑定的事件，可以通过下面实现：

function excute() {
	console.log('执行');
}
document.addEventListener('mousemove', excute); // 绑定
document.removeEventListener('mousemove', excute); // 解绑

注意事项： 我们在使用的函数中是通过bind绑定的，那么我们在addEventListener的第二个参数需要注意写法：

let obj = {};
function excute() {
	console.log('执行');
}
document.addEventListener('mousemove', excute.bind(obj)); // 绑定
document.removeEventListener('mousemove', excute); // 解绑

上面的写法是不能解绑事件，因为excute.bind(obj)是返回一个新的函数(bind的显示绑定实现就是返回一个新的函数)，我们可以称之为其为匿名函数，那么解绑时候，我们拿不到相同函数名，所以不能解绑，故通过下面方式解绑：

let obj = {};
function excute() {
	console.log('执行');
}
const fn = excute.bind(obj);
document.addEventListener('mousemove', fn); // 绑定
document.removeEventListener('mousemove', fn); // 解绑