vue.js中this为什么可以访问属性的属性

JavaScript021

vue.js中this为什么可以访问属性的属性,第1张

vue.js中this可以访问属性的属性的原因:

el、data、computed都应该理解为Vue对象的声明对象内容的关键字,而不是它的直接属性。

那么在data声明的就是它(vm本身)的数据属性,在computed中声明的就是它的计算属性,在methods中声明的就是它的方法。

先不管vuejs是怎么实现的,你贴的代码里面的this永远指向外层的作用域是因为“箭头函数”。

箭头函数好用,但是不要乱用,很多同学不知道箭头函数的特性,到处都用实际上带来了很多问题,但是这些问题又在某种程度上被babel之类的编译器抹掉了,所以实际上写了一堆有bug的代码自己却不知道。

箭头函数有两个特性:

函数体内不创建 this 变量,所以你套一万层也没用,因为他自己根本就没有this,所以最后你用的this全都是外面的this,这就让箭头函数有了仿佛可以支持词法层面的this的特性。

箭头函数函数体内不创建 arguments 变量,所以你在箭头函数内部也用不了arguments。

一些JS的新特性以及babeljs、coffe之类的预编译工具确实可以带来很多方便,但是使用之前一定要对其特性有所了解,否则写错了都不知道。