2024年前端最新面试题-vue3（持续更新中）

前言

Vue 官推消息，Vue 2 将于 2023年12月31日 停止维护（EOL）。

Vue 2.0 发布于 2016 年，迄今为止已有7年时间。Vue 2.0 的发布是其成为主流框架过程中的一个重要里程碑。

然而随着 2020 年 9 月份发布的 Vue 3 及其生态系统的日渐成熟，Vue 2.0 也渐渐退出了我们的视线，众多开发者们也在逐渐向 Vue3 靠拢。

早在2023年初，众多公司的面试重点就已经开始向Vue3倾斜。

2024有跳槽打算的朋友，拿下Vue3是重中之重。

正文

什么是 MVVC

• MVC全名是 Model View Controller,时模型 - 视图 - 控制器的缩写，一种软件设计典范。
  • Model(模型)：是用于处理应用程序数据逻辑部分。通常模型对象负责在数据库中存取数据。
  • View(视图)：是应用程序中处理数据显示的本分。通常视图是依据模型数据创建的。
  • Controller(控制器)：是应用程序处理用户交互的部分。通常控制器负责从视图读取数据，控制用户输入，并向模型发送数据。

• MVC的思想：一句话描述就是Controller负责将Model的数据用View显示出来，换句话说就是在Controller里面把Model的数据赋值给View。

什么是 MVVM

• MVVM新增了VM类。
  • ViewModel层：做了两件事达到了数据的双向绑定，一是将【模型】转化成【视图】，即将后端传递的数据转化成所看到的页面。 实现的方式时：数据绑定。二是将【视图】转化成【模型】，即将所看到的页面转换成后端的数据。实现的方式是：DOM事件监听。

• MVVM与MVC最大的区别就是：实现了View和Model的自动同步，也就是当Model的属性改变时，我们不用再手动操作Dom元素来改变View的显示。 而是改变属性后该属性对应的View层显示会自动改变（对应Vue数据驱动的思想）
• 整体看来，MVVM比MVC精简很多，不仅简化了业务与界面的依赖，还解决了数据频繁更新的问题，不用再用选择器操作DOM元素。因为在MVVM中，View不知道Model的存在，Model和ViewModel也察觉不到View，这种低耦合模式提高代码的可重用性。
• 注意：Vue并没有完全遵循MVVM的思想，这一点官网自己也有声明。

• 那么问题来了，为什么官方要说Vue没有完全遵循MVVM思想呢？
• 严格的MVVVM要求View不能和Model直接通信，而Vue提供了$refs这个属性，让Model可以直接操作View，违反了这一规定，所以是Vue没有完全遵循MVVM。

什么是 SPA

• 单页面应用（single page web application，SPA），就是只有一张Web页面的应用，是加载单个 HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。
• 一些应用在前端需要具有丰富的交互性、较深的会话和复杂的状态逻辑。Vue 不仅控制整个页面，还负责处理抓取新数据，并在无需重新加载的前提下处理页面切换。

什么是SFC

• Vue 的单文件组件 (即 *.vue 文件，英文 Single-File Component，简称 SFC) 是一种特殊的文件格式，使我们能够将一个 Vue 组件的模板