2.VUE组件data为什么必须是函数
答:Vue组件可能存在多个实例,如果使用对象形式定义data,则会导致它们共用一个data对象,那么状态变更将会影响所有组件实例,这是不合理的。
采用函数形式定义,在initData时会将其作为工厂函数返回全新的data对象,有效规避多实例之间状态污染问题。
而在Vue根实例创建过程中则不存在该限制,也是因为根实例只能有一个,不需要担心这种情况。
3.Vue中key的作用和工作原理
key的作用主要是为了高效的更新虚拟DOM,其原理是vue在patch过程中通过key可以精准判断两个节点是否是同一个,从而避免频繁更新不同元素,使得整个patch过程更加高效,减少DOM操作量,提高性能。
另外,若不设置key还可能在列表更新时引发一些隐蔽的bug。
vue中在使用相同标签名元素的过渡切换时,也会使用到key属性,其目的也是为了让vue可以区分它们,否则vue只会替换其内部属性而不会触发过渡效果。
4.你怎么理解vue中的diff算法?
diff算法是虚拟DOM技术的必然产物:通过新旧虚拟DOM作对比(即diff),将变化的地方更新在真实DOM上;
另外,也需要diff高效的执行对比过程,从而降低时间复杂度为0(N).
vue 2.x中为了降低Watcher粒度,每个组件必须有一个Watcher与之对应,只有引入diff才能精确找到发生变化的地方。
vue中的diff执行的时刻是组件实例执行其更新函数时,它会比对上一次渲染结果oldVnode和新的渲染结果newVnode,此过程成为patch.
diff过程整体遵循深度优先、同层比较的策略;两个节点之间比较会更具它们是否拥有子节点或者文本节点做不同操作;
比较两组子节点是算法的重点,首先假设头尾节点可能相同做4次比对尝试;
如果没有找到相同节点才按照通用方式遍历查找,查找结束再按情况处理剩下的节点;
借助key通常可以非常准确的找到相同节点,因此整个patch过程非常高效。
5.谈一谈对vue组件化的理解
组件是独立和可复用的代码组织单元。组件系统是Vue核心特性之一,它使开发者使用小型、独立和通常可复用的组件构建大型项目;
组件化开发能大幅提高应用开发效率、测试性、复用性等;
组件使用按分类有:页面组件、业务组件、通用组件;
vue的组件是基于配置的,我们通常编写的组件是组件配置而非组件,框架后续会生成其构造函数,它们基于VueComponent,扩展于Vue;
vue中常见组件化技术有:属性prop,自定义事件,插槽等,它们主要用于组件通信、扩展等;
合理的划分组件,有助于提升应用性能;
组件应该是高内聚、低耦合的;
遵循单向数据流的原则。
6.谈一谈对vue设计原则的理解?
答:首先就是渐进式JavaScript框架:与其它大型框架不同的是,Vue被设计为可以自底向上逐层应用。
Vue的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。
另一方面,当与现代化的工具链以及各种支持类库结合时,Vue也完全能够为复杂的单页应用提供驱动。
易用性
vue提供数据响应式、声明式模板语法和基于配置的组件系统等核心特性。
这些使我们只需要关注应用的核心业务即可,只要会写js,html和css就能轻松编写vue应用。
灵活性
渐进式框架的最大优点就是灵活性,如果应用足够小,我们可能仅需要vue核心特性即可完成功能;
随着应用规模不断扩大,我们才可能逐渐引入路由、状态管理、vue-cli等库和工具;
不管是应用体积还是学习难度都是一个逐渐增加的平和曲线。
高效性
超快的虚拟DOM和diff算法使我们的应用拥有最佳的性能表现。
追求高效的过程还在继续,vue3中将引入Proxy对数据响应式改进以及编译器中对于静态内容编译的改进都会让Vue更加高效。
7.对MVC、MVP和MVVM的理解
MVC
具备着View、Controller和Model
Model:负责保存应用数据,与后端数据进行同步
Controller: 负责业务逻辑,根据用户行为对Model数据进行修改
View: 负责视图展示,将Model中的数据可视化出来
MVP
MVP与MVC很接近,P指的是Presenter,presenter可以理解为一个中间人。
它负责着View和Model之间的数据流动,防止view和model之间直接交流。
MVVM(Model-View-ViewModel)
ViewModel通过实现一套数据响应式机制自动响应Model中数据变化;
同时ViewModel会实现一套更新策略自动将数据变化转换为视图更新;
通过事件监听响应View中用户交互修改Model中数据。
这样再ViewModel中就减少了大量DOM操作代码。
MVVM在保持View和Model松耦合的同时,还减少了维护他们关系的代码,使用户专注于业务逻辑,兼顾开发效率和可维护性。
总结
这三者都是框架模式,它们设计的目标都是为了解决Model和View的耦合问题。
MVC模式出现较早应用在后端,在前端领域的走起也有应用。
它们的优点是分层清晰,缺点是数据流混乱,灵活性带来的维护性问题。
MVP模式在是MVC的进化形式,Presenter作为中间层负责MV通信,解决了两者耦合问题,但P层过于臃肿会导致维护问题。
MVVM模式在前端领域有广泛应用,它不仅解决MV耦合问题,还同时解决了维护两者映射关系的大量繁杂代码和DOM操作代码,在提高开发效率、可读性同时还保持了优越的性能表现。原址