Vue--常见的面试题

1.Vue双向绑定

概念:vue.js采用数据劫持结合订阅者和发布者模式，通过object.defineProperty()劫持setter,getter属性，当数据发生变化的时候，触发相应监听回调渲染视图
其object.defineProperty()有三个参数，第一个参数代表要定义的属性对象，第二个参数是要修改的属性名称，第三个参数是一个对象
vue的数据双向绑定分为四个步骤
第一步oobserver进行递归遍历也就是数据劫持，在子属性对象的属性，添加setter和getter方法，这样给对象进行赋值时，触发setter，监听到数据的变化
第二步compile解析模板指令，将模板中的变量替换成数据，初始化渲染页面视图，每个指令对应的节点绑定更新函数，添加监听数据的订阅者，一旦数据发生改变，收到通知，更新视图
第三步 Watcher订阅者是observer和compile之间通信的桥梁t，主要做一下工作：
1.自身实例化时往订阅器Dep添加
2.自身有update()方法
3.收到Dep.notice通知时,调用自身update方法，触发监听compilr中的回调
第四步MVVM作为数据绑定入口，整和observer，compile，Watcher三者，通过observer监听数据变化，compile解析模板指令和Watcher作为observer和compile通信的桥梁，达到数据变化->视图更新->视图交互->数据变更

2.虚拟Dom和diff算法

概念:虚拟dom本质就是js对象，减少了真实的dom操作，当数据修改的时候，就是修改虚拟dom产生的全新虚拟dom
新旧虚拟dom使用diff算法，得到patch，然后将patch打到浏览器dom上
每次dom操作都会引起重绘或回流，频繁修改dom会触发进行多次重绘相当耗性能
优点：
1.提高性能：虚拟dom减少操作dom的次数，减少回流和重绘
2.虚拟dom相当于在js和真实dom中间的缓存，利用diff算法避免没不要的dom操作，从而提高性能
diff算法：就是新旧虚拟dom做对比，调用patch函数，一边比较一边给真实的dom打补丁

3.VueX

概念:vuex是专为vue.js提供的状态管理模式，采用集中式管理组件的数据,适用于大型项目，小型项目适当使用，使用场景：购物车，获取token还有很多地方都可以使用vuex
vuex有五大核心属性
1.state 存储数据 在组件中使用this.$stroe.state.方法名

2.mutations 直接操作state中的数据 在组件中使用this.$st