在之前的面试中遇到面试官让我讲解一下vue的get和set的原理,当时我有点蒙逼,个人熟练运用vue但并未去探究其原理,所以GG

现在讲解一下

get 和 set 是es5也就是es2015中的对象访问器,它在对象属性或方法获取值(get)时被触发,同时设置值得时候也会触发(set)

这是es5的特性

vue中的运用:

vue在组件本身是一个对象,当将此对象传入vue的实例的时候,vue会对data进行处理,通过JavaScript的对象方法:object.defineProperty (对象属性定义)将data每一个属性进行getter和setter化,

这样,当组件实例化完成的时候,data之下的所有属性已经被处理了,所以可以被vue内部追踪到每个属性的变化

并且,每个组件的实例化都会有一个相应的watch实例对象,它会在组件渲染的过程中,它会在组件渲染的过程中把属性记录为依赖,之后当依赖项的 setter 被调用时,会通知 watcher 重新计算,从而致使它关联的组件得以更新,对dom新型重新渲染

Logo

前往低代码交流专区

更多推荐