一个在 vue 里面的例子:
<div id="demo">{{ fullName }}div>
<script type="text/javascript">
var vm = new Vue({
el: '#demo',
data: {
firstName: 'Foo',
lastName: 'Bar',
testName: 'ddddd'
},
computed: {
fullName: function () {
console.log(1);
return this.firstName + ' ' + this.lastName
}
}
}) </script>
angluar 的 watch 方法监控变量,所以很好理解如果变量变化了,触发某个函数,这种语法用事件模型应该好实现
但是 vue 这个例子就有点好玩了,如果在控制台修改 vm.firstName=111,很显然 fullName 马上也修改了
但是如果我修改 vm.testName,当然 fullName 不会修改,但是我函数里放置的 console.log 也没有执行
这个就有点厉害了,也就是在 javascript 中一个函数体内有什么变量存在,都可以完全获取? 难道是靠词法分析获取的? 这个是怎么实现的呢????? @Vanessa
然后我又试验了一个:
var vm = new Vue({
el: '#demo',
data: {
firstName: 'Foo',
lastName: 'Bar',
tag:1
},
computed: {
fullName: function () {
console.log("run")
if(this.tag>0) {
console.log(1)
return this.firstName
}else {
console.log(2)
return this.lastName
}
}
}
})
我在外面修改 vm.lastname,控制台是不会打印 run 的,这说明程序知道代码不会走 else,else 里的代码修改不会对 fullname 起任何变化??? 这个也太屌了吧! 怎么实现的啊!!!
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于