Vue ​

• 卡颂-Vue.js 技术揭秘

思考一下问题：

• 之前的 MVC
  • Model 在 MVC 中实际是数据模型的概念，View 是视图，是将数据内容呈现给用户的界面界面层，Controller 是数据模型与 View 之间的桥梁层
• 如何理解 MVVM 原理
  • MVVM 想较于 MVC，在 Model 和 View 之间多了叫做 View-Model 的一层，将模型与视图做了一层绑定关系，视图完全由接口返回数据驱动，由开发者所控制的逻辑非常轻量。
  • 如何将数据模型与页面视图绑定起来呢？
    • Angularjs 的主动轮询检查新旧值变化更新视图
    • Vue 利用 ES5 的 Object.defineProperty 的 getter/setter 方法绑定，Vue3.0 基于 Proxy 和 Reflect
    • backbone 的发布订阅模式
• 响应式数据更新的原理是什么
  • 当 Object.defineProperty 方法在给数据 Model 对象定义属性的时候先挂载一些方法，在这些方法里实现与界面的值绑定响应关系，当应用的属性被读取或者写入的时候便会触发这些方法，从而达到数据模型里的值发生变化时同步响应到页面上。
    • new Vue 在实例化时，首先将 data 方法里返回的对象属性都挂载上 setter 方法，而 setter 方法里将页面上的属性进行绑定，当页面加载时，DOMContentloaded 事件触发后，调用 mounted 挂载函数，开始获取接口数据，获取完成后给 data 里属性赋值，赋值的时候触发前面挂载好的 setter 方法，从而引起页面的联动，达到响应式效果。
• Vue 中如何检测数组变化，Vue3 中如何检测数组变化
  • roxy 是 ES6 里的新构造函数，作用就是代理，想做一层在原对象操作前的拦截、检查、代理就可以用 Proxy
  • Reflect 是 ES6 里的新的对象：是 JS 中对象操作方法函数集合，Reflect 提供的方法完全与 Proxy 构造函数里 Hander 参数对象中的钩子属性一一对应。
• 为何 Vue 采用异步渲染
• nextTick 实现原理
• Vue 组件的生命周期
• ajax 请求放在哪个生命周期中
• 何时需要使用 beforeDestory
• Vue 父子组件生命周期调用顺序
• Vue 中 computed 的特点
• Watch 中 deep:true 是如何实现的
• Vue 中事件绑定的原理
• Vue 中 v-html 会导致哪些问题？
• Vue 中 v-if 和 v-show 的区别
• 为什么 v-for 和 v-if 不能连用
• v-model 中的实现原理，如何自定义 v-model
• 组件中的 data 为什么是一个函数
• Vue 组件如何通信
• 什么是作用域插槽
• 用 vnode 来描述一个 DOM 结构
• diff 算法的时间复杂度
• diff 算法原理
• v-for 中为什么要用 key
• 描述组件渲染和更新过程
• Vue 中模版编译原理
• Vue 中常见的性能优化
• Vue 中相同逻辑如何抽离
• 为什么要使用异步组件
• keep-alive 的实现原理
• 实现 hash 和 history 路由
• Vue-Router 中导航守卫有哪些
• action 和 mutation 的区别
• 简述 Vuex 工作原理
• Vue3.0 有哪些改进