概念

⭐️ Vue的优点？Vue的缺点？

• 优点
  • 渐进式
    • vue 本身只提供数据响应式，需要全局缓存用 vuex/pinia，需要路由用 vue-router
  • 组件化
    • 封装组件，利于复用
  • 响应式数据
    • 减少DOM的操作，专注数据逻辑处理，高效开发
• 缺点
  • 不利于 SEO
    • 爬虫爬取的时候只看见根容器 #app 和一堆 script 脚本，看不到 DOM 和内容，因为得先加载 vue，vue 再动态渲染出 DOM
  • 浏览器兼容性
    • Vue2 不兼容 IE8 及其以下版本，Vue2 实现了 Object.defineProperty ，但只能在 DOM 对象上使用；在原生JS对象上使用会报错
    • Vue 3 使用 Proxy 来实现响应式系统，因此不支持 IE11。
  • 响应式系统的局限性
    • Vue 2 使用的是基于 Object.defineProperty 的响应式系统，无法追踪对对象或数组的直接操作（如新增属性、删除属性等），需要手动触发更新。
    • Vue 3 的响应式系统使用了 ES6 的 Proxy，可以追踪对对象属性的动态增删、数组的操作等，解决了 Vue 2 的局限性。

Vue 跟 React 有什么异同

• 相同
  • 都是单向数据流
  • 都使用了 虚拟DOM 技术
  • 都支持 SSR
  • 都是基于组件化开发
• 不同点
  • 视图
  • vue: template
  • react: JSX
• 数据改变
  • vue: 响应式
  • react: 手动 setState
• 事件绑定
  • vue: 双向绑定
  • react: 单向绑定
• 状态管理工具
  • vue: Vuex
  • react: Redux、Mobx

⭐️ Vue 和 JQuery 的区别在哪？为什么放弃 JQuery 用 Vue ？

• 双向数据绑定
  • jQuery：主要通过手动操作 DOM 来更新界面，开发者需要手动查找 DOM 元素并更新数据。复杂项目中，随着页面的变化，可能需要手动管理多个状态。
  • Vue：Vue 采用双向数据绑定（双向绑定常用于表单），它使用响应式数据模型，一旦数据发生变化，界面会自动更新。开发者只需要专注于数据的管理，Vue 会处理 DOM 更新。
• 虚拟DOM技术带来的性能优化
  • jQuery：jQuery 直接操作 DOM，频繁的 DOM 操作在性能上可能会有瓶颈，特别是当更新频率较高时，性能不理想。
  • Vue：Vue 内部使用虚拟 DOM，它会通过最小化的 DOM 更新来提高性能。Vue 还提供了许多性能优化手段，如懒加载、按需加载等。
• 工具库 vs 框架
  • jQuery：jQuery 提供了大量的插件和扩展，但它不是一个完整的前端框架，只是一个工具库，开发者通常还需要借助其他库来进行复杂的功能开发。
  • Vue：Vue 是一个完整的前端开发框架，提供了Vue Router（路由）、Vuex（状态管理）、Vue CLI（构建工具）等工具，并且拥有一个强大的生态系统，开发复杂的单页应用更加便捷。

⭐️ MVC 和 MVVM 区别

• MVC
  • Model 负责从数据库中取数据
  • View 负责展示数据
  • Control 负责从 Model 中获取数据渲染到 View ，负责用户交互（e.g. 点击事件）
  • 思想：Controller将Model的数据展示在View上
• MVVM
  • Model 取数据的地方
  • View 展示数据的地方
  • VM ModelView 数据双向绑定
  • 思想： View 和 Model 实现数据同步，不需要手动更新
    • VM提供了数据的双向绑定
    • 注意：Vue不严格符合MVVM，因为MVVM规定Model和View不能直接通信，而Vue可以使用ref进行通信

data

为什么data是个函数并且返回一个对象呢？

对象是个引用值，多个组件使用同一个引用会导致变量污染。我们只是希望组件样式和行为复用，而不希望数据内容也完全一样。而返回一个函数就能解决这个问题，因为每次函数执行后都返回的是个新对象