前端面试题整理—vue篇(代码片段)

theblogs theblogs     2022-12-04     649

关键词:

 1、对vue的理解,他有什么特点,vue为什么不能兼容IE8及以下浏览器

  vue是一套用于构建用户界面的渐进式框架,核心是一个响应的数据绑定系统

  vue是一款MVVM框架,基于双向绑定数据,当数据发生变化时候,vue自身会进行一些运算

  特点:简洁轻量、数据驱动、组件化、模块友好

  vue.js使用了IE8无法模拟的 ECMAScript 5 特性,没有替代方案

 

2、简述Vue双向数据绑定的原理

  主要是通过Object对象的defineProperty属性,重写data的set和get函数来实现的

  vue是通过数据劫持的方式来做数据绑定,最核心的方法就是通过Object.defineProperty()来实现对属性的劫持

  在设置或者获取的时候我们就可以在get或者set方法里加入其他的触发函数,达到监听数据变动的目的

 

3、什么是MVVM,和MVC的区别

  MVVM是Model-View-ViewModel的缩写

  Model层代表数据模型

  View代表组件视图,负责将数据模型转化成UI展现出来

  ViewModel是一个同步 View 和 Model 的对象(双向绑定)

  在MVVM中,View和Model之间并没有直接的联系,而是通过ViewModel进行交互,

  Model和ViewModel之间的交互是双向的,因此 通过视图操作数据,也能通过数据操作视图

  MVC是Model-View- Controller的简写。即模型-视图-控制器,使用MVC的目的是为了将M和V相分离

  MVVM与MVC最大的区别就是实现了View和Model的自动同步,也就是当Model的属性改变时

  我们不用再手动操作Dom来改变View,而是改变后该属性对应View层会自动改变

 

4、vue.js的两个核心是什么

  数据驱动和组件化思想

 

5、vue与angular的区别

  vue的双向邦定是基于ES5中getter/setter来实现的,而angular是由自己实现一套模版编译规则,需要进行所谓的“脏值”检查,vue则不需要

  vue需要提供一个el对象进行实例化,后续的所有作用范围也是在el对象之下,而angular而是整个html页面

 

6、说下vue的底层原理

  Vue的模式是m-v-vm模式,即(model-view-modelView),通过modelView作为中间层,进行双向数据的绑定与变化

  1)通过建立虚拟dom树document.createDocumentFragment(),方法创建虚拟dom树

  2)一旦被监测的数据改变,会通过Object.defineProperty定义的数据拦截,截取到数据的变化

  3)截取到的数据变化,从而通过订阅——发布者模式,触发Watcher(观察者),从而改变虚拟dom的中的具体数据

  4)最后通过更新虚拟dom的元素值,从而改变最后渲染dom树的值,完成双向绑定

 

7、如何使css只在当前组件起作用

  如果想写的css只对当前组件起作用,则在style中写入scoped

 

8、vue中v-if和v-show的区别

  v-if和v-show都是用来控制元素的渲染

  v-if是根据后面数据的真假,来判断DOM的添加删除等操作

  v-show只是在修改元素的css样式(display属性值)

  v-if如果初始渲染条件为真,就渲染,反之就不渲染

  v-show不管初始条件是否为真,都会被渲染

  v-if有更高的切换消耗,不适合做频繁的切换

   v-show有更高的初始渲染消耗,适合做频繁的切换

 

9、请举例vue常用的修饰符

  事件修饰符:stop、prevent、self、once  

  lazy、number、trim、exact

 

10、v-on可以绑定多个方法吗?

  可以

<input v-on:keyup.enter="submit" v-on:focus="onFocus">

 


  

前端面试题汇总-vue篇(代码片段)

1. Vue的基本原理当一个Vue实例创建时,Vue会遍历data中的属性,用Object.defineProperty(vue3.0使用proxy)将它们转为getter/setter,并且在内部追踪相关依赖,在属性被访问和修改时通知变化。每个组件实例都有相... 查看详情

vue前端面试题(代码片段)

第一章面试题基础篇​1.1HTML面试题​面试题:行内元素有哪些?块级元素有哪些?空(void)元素有哪些?行内元素:span、img、input...块级元素:div、footer、header、section、p、h1...h6...空元素:br、hr...元素... 查看详情

前端面试指南|230页前端初级工程师面试题精编解析大全(代码片段)

目录前言前端初级工程师面试题HTML篇CSS篇JavaScript篇浏览器篇服务端与网络Vue框架算法篇前言初级前端工程师如何有计划的学习前端?前端基础是第一步也是非常重要的一步,从初学前端到成长为一名架构师,会经历... 查看详情

022.整理几个面试题——关于vue原理(简)(代码片段)

...,泛指后端进行的各种业务逻辑处理和数据操控对于前端来说就是后端提供的api接口View层:即视图层,也就是用户界面前端主要由HTML和CSS来构建ViewModel层& 查看详情

web前端面试题整理(代码片段)

---恢复内容开始---1.浏览器的内核分别是什么?  IE:trident内核  Firefox:gecko内核  Safari:webkit内核  Opera:以前是presto内核,Opera现已改用GoogleChrome的Blink内核  Chrome:Blink(基于webkit,Google与OperaSoftware共同开发)2.一次完... 查看详情

vue.js面试题整理(代码片段)

Vue.js面试题整理一、什么是MVVM?MVVM是Model-View-ViewModel的缩写。MVVM是一种设计思想。Model层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑;View代表UI组件,它负责将数据模型转化成UI展现出来,ViewModel是一个同步V... 查看详情

java面试题整理《集合篇》(代码片段)

Java集合集合就是一个可变长度的用来存放数据的容器,准确的说是存放数据对象引用的容器,集合类存放的都是对象的引用,而不是对象的本身(不能存储基本数据类型)。集合类存放于Java.util包中,主... 查看详情

java面试题整理《集合篇》(代码片段)

Java集合集合就是一个可变长度的用来存放数据的容器,准确的说是存放数据对象引用的容器,集合类存放的都是对象的引用,而不是对象的本身(不能存储基本数据类型)。集合类存放于Java.util包中,主... 查看详情

前端芝士树vue.js面试题整理/知识点梳理(代码片段)

【前端芝士树】Vue.js面试题整理MVVM是什么?MVVM是Model-View-ViewModel的缩写。Model代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑。View代表UI组件,它负责将数据模型转化成UI展现出来。ViewModel监听模型数据的改变和... 查看详情

时隔许久,精心整理的超级实用的web前端面试题总结后续来啦(代码片段)

文章目录Web前端面试题总结(二)JavaScript篇1、JavaScript是一门什么样的语言,它有哪些特点?2、javascript的本地对象,内置对象和宿主对象?3、js的内置对象有哪些?列举一下arry和string的常用方法?... 查看详情

java面试题超详细整理《spring篇》(代码片段)

什么是Spring框架?Spring是一个开源的轻量级的Java开发框架,以Ioc(InverseOfcontrol:反转控制)和AOP(AspectOrientedProgramming:面向切面编程)为内核,提供了展现层SpringMVC和持久层SpringJDBC以及业务层事务管理... 查看详情

java面试题整理《springboot篇》(代码片段)

什么是SpringBoot?Spring的缺点:复杂的配置:配置十分繁琐,环境配置会占用写应用程序逻辑的时间,增加开发时的损耗。依赖管理:项目的依赖管理也是一件耗时耗力的事情。在环境搭建时,需要分析... 查看详情

java面试题整理《springboot篇》(代码片段)

什么是SpringBoot?Spring的缺点:复杂的配置:配置十分繁琐,环境配置会占用写应用程序逻辑的时间,增加开发时的损耗。依赖管理:项目的依赖管理也是一件耗时耗力的事情。在环境搭建时,需要分析... 查看详情

前端笔试题面试题记录(下)(代码片段)

前言接上篇前端笔试题面试题记录(上)。趁清明小长假,把上篇剩下的部分也写一下,因为最近比较忙这篇已经拖了很久了。现在刚刚开始银四了,应该还是有些小伙伴在找工作,时间还不算太晚,希望本篇可以帮到这些小伙... 查看详情

java面试题超详细整理《jvm篇》(代码片段)

JVM由那些部分组成,运行流程是什么?JVM的由以下几部分组成:类加载器(ClassLoader):Java的动态类加载功能由ClassLoader子系统处理。它加载,链接。并在运行时(而非编译时)首次引用类时初... 查看详情

java面试题超详细整理《jvm篇》(代码片段)

JVM由那些部分组成,运行流程是什么?JVM的由以下几部分组成:类加载器(ClassLoader):Java的动态类加载功能由ClassLoader子系统处理。它加载,链接。并在运行时(而非编译时)首次引用类时初... 查看详情

一名深漂程序员:我所整理和收集的前端面试题(笔记)(代码片段)

系列文章目录一名深漂程序员:我所整理和收集的前端面试题(一)一名深漂程序员:我所整理和收集的前端面试题(二)一、如何做性能优化1.webpack工程环境层面的优化1.新的工具,更好的代码压缩... 查看详情

一名深漂程序员:我所整理和收集的前端面试题(笔记)(代码片段)

系列文章目录一名深漂程序员:我所整理和收集的前端面试题(一)一名深漂程序员:我所整理和收集的前端面试题(二)一、如何做性能优化1.webpack工程环境层面的优化1.新的工具,更好的代码压缩... 查看详情