前端面试题知多少

组件通讯

父传子： props　/ $emit
子传父： $emit　/ $on

多级组件之间传递数据： $attrs　/ $listeners
父子通信： 父向子传递数据是通过 props，子向父是通过 events（ $emit）；
通过父链 / 子链也可以通信（ $parent / $children）；ref 也可以访问组件实例；
provide / inject API； a t t r s / attrs/attrs/listeners
· 兄弟通信： Bus；Vuex
· 跨级通信： Bus；Vuex；provide / inject API、 attrs / attrs/attrs/listeners

说说你对MVVM的理解

MVVM全称是Model-View-ViewModel
Model 代表数据模型，数据和业务逻辑都在Model层中定义；泛指后端进行的各种业务逻辑处理和数据操控，对于前端来说就是后端提供的 api 接口。
View 代表UI视图，负责数据的展示；视图层，也就是用户界面。前端主要由 HTML 和 CSS 来构建 。
ViewModel 负责监听 Model 中数据的改变并且控制视图的更新，处理用户交互操作；
Vue是以数据为驱动的，Vue自身将DOM和数据进行绑定，一旦创建绑定，DOM和数据将保持同步，每当数据发生变化，DOM会跟着变化。 ViewModel是Vue的核心，它是Vue的一个实例。Vue实例时作用域某个HTML元素上的这个HTML元素可以是body，也可以是某个id所指代的元素。

父子组件生命周期渲染过程

首次加载：先父组件create初始化创建js模型，然后子组件创建js模型
子组件渲染完之后，父组件再渲染
创建实例是从外到内的，渲染是从内到外的
加载渲染：
父beforeCreate —> 父created —> 父beforeMount —> 子beforeCreate —> 子created —> 子beforeMount —> 子mounted —> 父mounted
更新阶段：父beforeUpdate —> 子beforeUpdate —> 子updated —> 父updated 销毁：
父beforeDestroy —> 子beforeDestroy —> 子destroyed —> 父destroyed

Vue响应式原理

响应式：当数据改变后，Vue会通知使用该数据的代码
比如说：视图渲染使用了一个数据
那么当这个数据改变后，视图会响应式的自动更新
Vue 它是通过那个Object.defineProperty() 来更新定义 data中的所有属性