锐客网

  1. 首页 > it技术 > >

前端框架VUE面试基础问答

【前端框架VUE面试基础问答】VUE属于现在比较热门的前端框架，在前端培训学习VUE好上手学习起来也不难，所以有时间还想从事前端的朋友还请认真看完。
什么是VUE？
首先Vue.js（VUE），是一套用于构建用户界面的渐进式JavaScript 框架，自底层向上应用，Vue的核心库只关注视图层，容易入门，可以和第三方库或者已有的项目进行整合，可以做复杂的单页应用。
前端框架VUE面试基础问答
文章图片

VUE的两个核心是什么？
数据驱动：在VUE中，数据的改变会驱动视图的自动更新。传统做法是需要手动改变DOM来使视图更新，而VUE只需要改变数据。
组件化：组件化开发优点很多，可以很好的降低数据之间的耦合度。将常用代码封装成组件之后就能高度的复用，提高代码可复用性。
这里说一下，一个页面可以有多个模块/组件组成。
什么是VUE的MVVM模式？
MVVM 是 Model-View-ViewModel 的缩写。mvvm 是一种设计思想。Model 层代表数据模型，也可以在 Model 中定义数据修改和操作的业务逻辑；View 代表 UI 组件，它负责将数据模型转化成 UI 展现出来，ViewModel 是一个同步View 和 Model 的对象。
在 MVVM 架构下，View 和 Model 之间并没有直接的联系，而是通过 ViewModel 进行交互，Model 和 ViewModel 之间的交互是双向的， 因此 View 数据的变化会同步到 Model 中，而 Model 数据的变化也会立即反应到 View 上。
ViewModel 通过双向数据绑定把 View 层和 Model 层连接了起来，而 View 和 Model 之间的同步工作完全是自动的，无需人为干涉，因此开发者只需关注业务逻辑，不需要手动操作 DOM, 不需要关注数据状态的同步问题，复杂的数据状态维护完全由 MVVM 来统一管理。
前端框架VUE面试基础问答
文章图片

MVVM和MVC有什么区别？
mvc 和 mvvm 其实区别并不大。都是一种设计思想。主要就是 mvc 中 Controller 演变成 mvvm 中的 viewModel。mvvm 主要解决了 mvc 中大量的 DOM 操作使页面渲染性能降低，加载速度变慢，影响用户体验。
前端框架VUE面试基础问答
文章图片

什么是VUE的双向绑定？
VUE的双向绑定是通过数据劫持结合发布者——订阅者的方式实现。
我们知道双方是绑定的，首先对数据进行劫持监听，所以需要监听器Observer，用来监听所有属性，如果属性发生变化，就需要告诉订阅者Watcher是否需要更新，因为订阅者是多个，所以要有一个消息订阅起来专门收集这些订阅者，然后在监听器Observer和订阅者Watcher之间进行统一管理，接着有一个指令解析器conpile，对每个节点元素进行扫描和解析，将相关指令对应初始化成一个订阅者Watcher，并替换模板或者绑定相应的函数，此时订阅者Watcher接收到相应属性变化，就会执行对应的更新函数，从而更新视图。
实现一个监听器Observer，用来劫持所有属性，如果有变动就通知订阅者Watcher。
实现一个消息订阅器Watcher，用来收到属性的变化通知并执行相应函数从而更新。
实现一个解析器Compile，可以扫描和解析每个节点的相关指令，并根据初始化模板以及初始化相应的订阅器。
前端框架VUE面试基础问答
文章图片

V-IF和V-SHOW有什么区别？
两者都是用来判断DOM节点是否显示。
实现方式
V-IF 根据后面数据的真假值判断从DOM树上删除或重建节点。
V-SHOW 只是修改CSS样式，也就是Display的属性。
编译条件
V-IF 是惰性的，如果初始条件为假则什么也不做，只有在第一条件为真时才开始局部编译 。
V-SHOW 是在任何条件下都被编译，然后被缓存，而且DOM元素始终保留。
编程过程
V-IF 切换有一个局部编译/卸载的过程，切换过程中合适地销毁和重建内部的事件监听和子组件。
V-SHOW 只是简单的基于CSS切换。
性能消耗
V-IF 有更高的切换消耗，不适合做频繁切换。
V-SHOW 有更高的渲染消耗，适合做频繁切换。

    推荐阅读


    上一篇：携手世界环境服务巨头！DataPipeline助力其亚洲区业务数据实时融合

    下一篇：宜扫除