二读Vue2源码, Vue2数据劫持具体操作

鄙人不才啊,觉得鱿鱼须这个对data数据的处理,进行了两次代理,好像有点多余. 第一次的时候传递两个参数是可以直接实现数据代理的,劫持的话好像不太需要.
至于为啥要嵌套两层,我的理解是:
第一层,可以叫做数据劫持吧,自己代理自己,把自己的属性重新定义并且都添加上get set . 这里的话还进行了别的操作.比如对数组方法的重写啊,对象一些方法的重写.分两次封装应该也是为了区分这个这个 拿值和处理值吧. 第一步算是对这个值进行一系列的处理.
第二层,就是单纯的为了能够从new出来的实例对象身上直接拿值,拿值比较方便,单纯的就是为了拿值

第一次可以叫做数据劫持, 第二次就叫数据代理.
其实两次操作用的都是Object.definePropoty(),底层逻辑都jb一样就是叫起来好听.
这段data的处理其实还挺好玩的,读明白之后就知道data里面的各种可行不可行的操作. 尤其是对 数组 对象的一些操作,为啥操作了页面没有响应呢?呵呵,那肯定你瞎jb搞了,导致这个数据每本检测到了
这段其实真挺有意思可以学习到的js高级知识为:
1.递归
2.类的相关知识(学过java的其实就很容易理解这个概念)
3.this(这个this需要配合对于这个 前端原型链 的深度理解)
4.原型链(什么prototype ,proto 这两什么区别,原型链有几层,原型链之间的全等关系,这个也很有意思)
5.闭包(data的数据劫持,数据代理利用的都是闭包,每处理一个属性,对象,数组,都会开辟一个内存,并且一直不会被销毁)
6.new的时候都干了什么 (这个比较重要吧,不然连源码的第一行代码都看不懂)

posted @ 2025-04-19 11:58  帅到被人砍的阿豪  阅读(13)  评论(0)    收藏  举报