一、响应式原理:
get收集,set更新。
二、子组件原理:
在render阶段生成组件构造函数VueComponent和组件vnode,在update阶段进行子组件初始化,将template生成真实节点elm,将elm赋值给组件vnode的elm属性
三、nextTick原理:
将要更新的watcher和手写的callback收集到一个数组中,在定时器中遍历数组元素,执行watcher.run和callback函数。
四、对象新加属性响应:
给对象属性赋值,并且手动更新dep.notify()
五、数组变异方法响应式:
先执行数组方法,再手动更新dep.notify()
六、key的作用:
快速找下标
七、父子组件通信原理:
- 父传子:
父组件将data传递给组件vnode,组件vnode见data传递给组件实例,组件实例通过代理就可以直接使用this访问data了 - 子传父:
将函数名和函数值做成一个map,子组件调用$emit,其实根据传入的参数执行响应的函数,在函数中修改父组件的data
八、编译原理:
将源码编译成AST,将AST转换成with函数
九、vue-router原理:
hash路由原理:监听hashchange事件获得hash值,来改变视图
history路由:通过pushState和replaceState设置历史记录并根据url来改变视图,当触发popsState获得最新url,来改变视图。
十、vuex原理与计算属性原理:
将state赋值给内部vue实例的date,在state的get函数中收集计算属性Watcher和渲染Watcher,在state的set函数中更新。