vue源代码里的数据应该如何进行访问介绍

相信很多程序员朋友对于vue应该都并不陌生了，毕竟平日里都经常使用他来进行一些操作，但是有些朋友对vue的一些相关知识可能了解的只是一小部分，今天小编就以vue数据的代理访问作为示例来给大家具体的讲解一下，希望对大家有所帮助。

概念解析：

1) 数据代理: 通过一个对象代理对另一个对象(在前一个对象内部)中属性的操作(读/写)

2) vue 数据代理: 通过 vm 对象（即this）来代理 data 对象中所有属性的操作

3) 好处: 更方便的操作 data 中的数据

4) 基本实现流程

a. 通过 Object.defineProperty()给 vm 添加与 data 对象的属性对应的属性描述符

b. 所有添加的属性都包含 getter/setter

c. getter/setter 内部去操作 data 中对应的属性数据

疑问

不知道你在使用Vue的时候有没有想过，为什么定义在 data 对象中的属性，可以用 Vue 的实例 this 进行访问？

我们来看看源码的实现。

比如有个如下demo

也就是说当我们这样 this.message 写的时候， Vue 通过 Object.defineProperty 给 this.message 设置一层代理，实际访问的是 this._data 里的 message 属性，而 this._data 指向的对象就是我们写的 data 对象。

好了，今天给大家介绍的vue源代码里的数据之间的代理访问过程就给大家介绍到这里了，是不是很简单清晰呢？如果大家对于这方面还想了解更多内容的话也可以自行搜索一番，小编这里就不一一进行讲解了。