首页 > 代码库 > 坑爹的箭头函数
坑爹的箭头函数
es6（es2015）中引入了箭头函数，形如
() => { console.log(‘arrow function!‘);}// 相当于function() { console.log(‘arrow function!‘);}
爱好新技术的我，当然是热情拥抱她，把所有的function 都用箭头取代了
然而这给我今天的开发带来的灾难性的打击，浪费了整整一下午时间终于发现他们之间其实还是有很大区别的，由于过分钟爱她，以致于始终不愿意相信是她出了问题。
出问题的代码如下：
watch: { ‘calendar.value‘: (value) => { this.calendar.items[this.calendar.picker].value =http://www.mamicode.com/ value; }},
这是Vue组件中的一段代码， 对于Vue组件，this无处不在，方法中，钩子函数中，Watch选项中。。。
然而，在这段代码中this竟然指向了window对象，导致整个页面都出错了，功能瘫了大半。
百思不得其解，后来终于不得不承认是箭头函数出了问题，换成如下传统方式就解决了问题了
watch: { ‘calendar.value‘: function(value) { this.calendar.items[this.calendar.picker].value = http://www.mamicode.com/value;>
万般感慨，深刻反思以后，写下此文以加深记忆，不能再浪费时间踩这个坑了。。。
坑爹的箭头函数
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。