Object.defineProperty回顾


虽然说直接在对象里面定义属性,这样更快,但是使用原型链的方式向对象中添加属性,这样不仅仅显得更高阶,并且还有一个很重要的区别,就是使用(Object.defineProperty)这个添加之后的属性不可枚举(遍历)

首先从控制台输出中查看其区别


可以看出在使用原型链方式添加的属性中,在控制台中打印出来的属性为灰色,也即是不可枚举

可以很明显的看到,age属性没有被遍历出来

Object.defineProperty中存在的get、set方法也极为重要

虽然也在全局中定义了myhome属性,但是如果按照此时这种声明方式,只修改myhome的值时,会发现person3.address的值没有发生修改,其是这个就是由于js的执行机制有关,并且此时,我个人认为可以理解成此时是深度拷贝,拷贝的是其值,所以当myhome修改之后,person3.address并没有发生对应的修改


可以看到,该address在输出时,首先是由三个点代替的,如果想要知道去具体的值,需要点击。点击之后,也即是遍历了改address属性,就会触发get即getter方法,执行其中的逻辑
但是此时如果修改myhome的值,会发现person2中的address属性的值没有发生改变,如果想要其发生改变,那就需要借助set即setter方法了

此时就会发现,当修改了person2.address的值时,myhome的值也对应修改了,个人认为此时也可简单理解成为了浅拷贝
在Vue中,使用Object.defineProperty()实现MVVM的表单中的双向数据绑定
最后修改:2022 年 01 月 08 日