Vue中的计算属性的getter

Question

在学习Vue框架的时候，学到了计算属性这个内容，书上说，在计算属性里写一个get函数，然后读取属性值的时候，就会调用到get函数。那么，这个过程是怎么实现的呢？get函数不是自己写的吗？为什么vue知道要去调用这个函数呢？

Answer 1

在vue2中，这个get是Object.defineProperty()中的一个访问器属性，任何一个变量都会有set/get/value/write这样的四个内置属性，在给变量赋值的时候会触发set，在访问变量的值的时候会触发get。Object.defineProperty则是可以修改这四个内置属性。vue2正式通过数据劫持实现这个过程。
vue3中则是通过proxy拦截get操作。以下给一个Object.defineProperty的例子。

var obj = {}; // Creates a new object 创造对象
Object.defineProperty(obj, "hello", {   
         get: function () {
                console.log('触发了get')
                return "123"
          },
})
console.log(obj.hello)
//先打印  触发了get
// 再打印 123