iframe vue 前进 后退_前端面试准备笔记系列之vue(01)

目录

01. 对于MVVM的理解?

02. 概述Vue以及优缺点？

03. vue等单页面应用及其优缺点

04. Vue实现数据双向绑定的原理

05. vue.js的两个核心是什么？

06. css如何只在当前组件起作用

07. vue几种常用的指令

08. v-on 可以绑定多个方法吗？

正文

01. 对于MVVM的理解?

• Model 代表数据模型
• View 视图，代表UI组件，负责将数据模型通过UI展示出来
• ViewModel 监听Module改变View，监听数据模型控制视图的行为，处理交互。
• 在MVVM架构下，View和Model并没有直接的联系，而是通过ViewModle进行交互，因此开发者只需要关注业务逻辑，不需要手动控制DOM，不需要关注数据状态的同步问题。
• 之前的jquery开发是面向dom开发，而MVVM是面向数据编程，DOM操作被简化，一般能减少30%左右的代码量。

02. 概述Vue以及优缺点？

• Vue本身并不是一个框架，它是结合周边的生态构成了一个灵活的、渐进式框架。
• Vue的核心思想：数据驱动、组件化
• Vue和React,目前都是用了virtual Dom(虚拟dom)实现快速渲染，都是轻量级，响应式组件，服务端渲染，易于集成路由工具，打包工具以及状态管理，都具有优秀的支持和社区。

虚拟dom： DOM是文档对象模型，整个html文档就是一个dom。 virtual dom，虚拟dom，就是在js内存中构建一个类似dom的对象，去模拟dom进行数据拼装，进行渲染和解析，最后一次性插入html的dom片段中去。

03. vue等单页面应用及其优缺点

• 优点：Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件，核心是一个响应的数据绑定系统。MVVM、数据驱动、组件化、轻量、简洁、高效、快速、模块友好。
• 缺点：不支持低版本的浏览器，最低只支持到IE9；不利于SEO的优化(如果要支持SEO，建议通过服务端来进行渲染组件)；第一次加载首页耗时相对长一些；不可以使用浏览器的导航按钮需要自行实现前进、后退

04. Vue实现数据双向绑定的原理

Object.defineProperty() vue实现数据双向绑定主要是：采用数据劫持结合发布者-订阅模式的方式，通过Object.defineproperty()来劫持各个属性的setter，getter方法，在数据变动的时候发布消息给订阅者，触发相应的监听回调。把一个普通的JavaScript对象传给Vue实例作为它的data选项时，Vue将遍历它的属性，用Object.defineProperty()将他们转为getter/setter,用户看不到，但是在内容让vue进行追踪，在属性被访问和修改的时候通知变化。

05. vue.js的两个核心是什么？

数据驱动、组件系统

06. css如何只在当前组件起作用

• 在style标签中写入scoped即可 例如：
• 原理是在HTML的DOM节点上加一个不重复的属性如：data-v-469af010

07. vue几种常用的指令

• v-text
• v-html
• v-show
• v-if
• v-else-if
• v-else
• v-for
• v-on
• v-model
• v-bind
• v-once：组件和元素只渲染一次，当数据发生变化，也不会重新渲染。

08. v-on 可以绑定多个方法吗？

可以

点击

写在最后

本文是在准备面试过程中整理的vue面试中可能遇到问题相关系列的第一篇文章，由于以上内容纯手敲，可能有手误的地方，也可能有错误的地方，希望大家指正和见谅。最后，希望与每一个努力的人同行，一起加油！！！