Javascript 事件

匿名函数和带箭头函数的区别

---

区别

匿名函数和带箭头函数绑定不同的this对象，匿名函数绑定的是注册监听器的事件本身，而箭头函数则继承绑定他所在函数的this对象。这种区别在类中方法间的调用尤为明显。

···
	class Test {
		constructor(){
			this num = 3;
			this.but = document.querySelector('botton');
		}
		run(){
			//弹窗弹出，成功显示3,因为this绑定了run所在对象
			this.but.addEventListener('click', () => {this.display();});
			//点击按钮没有弹窗弹出，控制台出现错误提示：...this.display is not a function，因为this绑定的是but，而but没有display这个方法
			this.but.addEventListener('click', function() {this.display();});
			//弹窗弹出，但显示undefined，这种情况下display中的this没有定义
			this.but.addEventListener('click', this.display);
		}
		display(){
			alert(this.num);
		}
	}
	let test = new Test();
	test.run();
···