vue的双向绑定原理：
vue数据的双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的。

                介绍：
                VueJS：采用 ES5 提供的 Object.defineProperty() 方法，监控对数据的操作，从而可以自动触发数据同步。并且，由于是在不同的数据上触发同步，可以精确的将变更发送给绑定的视图，而不是对所有的数据都执行一次检测。
                参数介绍：
                    第一个参数：目标对象
                    第二个参数：需要定义的属性或方法的名字。
                    第三个参数：目标属性所拥有的特性：{
                                API:介绍
                                value：属性的值。
                                writable：如果为false，属性的值就不能被重写,只能为只读了。
                                configurable：总开关，一旦为false，就不能再设置他的（value，writable，configurable）。
                                enumerable：是否能在for...in循环中遍历出来或在Object.keys中列举出来。
                                get：见下面例子。
                                set：见下面例子。

                    }
 
 
代码演示：
　　　　
<div>
      <span id="name"></span>
      <div id="address"></div>
 </div>

    <script>
      let obj = {};
      //  最基本写法
      Object.defineProperty(obj, "sex", {
        get: () => {
          console.log("get 获取值");
        },
        set: (value) => {
          console.log(value);
        },
      });
      obj.sex = "男";

      // 实现数据和视图的联动。
 
      Object.defineProperty(obj, "name", {
        get: () => {
          return document.getElementById("name").innerHTML;
        },
        set: (value) => {
          document.getElementById("name").innerHTML = value;
        },
      });
      Object.defineProperty(obj, "address", {
        get: () => {
          return document.getElementById("address").innerHTML;
        },
        set: (value) => {
          document.getElementById("address").innerHTML = value;
        },
      });
      obj.name = "小白";
      obj.address = "河南";
    </script>