关于addEventListener中事件函数的this指向问题

看代码:

//定义一个可见的盒子用于绑定点击事件
var box = document.getElementById('box');
box.x = 'box'

//设置执行函数的对象属性
function outFunc() {
  this.x = 'outFunc';
  box.addEventListener('click', func, false);
}
outFunc();

function func() {
  console.log(this.x); //输出box 说明该this指向的是调用addEventListener的对象
}

代码2:

function outFunc() {
  this.x = 'outFunc';//给全局对象window.x赋值(相当于赋值全局变量)
  box.addEventListener('click', func.bind(this), false);
}
function func() {
  console.log(this.x); //输出outFunc 使用bind设置this的值
}

总结,使用bind绑定的事件才是指向函数,否则指向的是调用addEventListener的对象。

原文地址:https://www.cnblogs.com/chongyao/p/6737856.html