说出vue常用的指令:

v-text,  v-html,  v-bind,  v-for,  v-if,  v-else,  v-else-if,   v-show,    v-on,

谈谈你对MVC的理解:

MVC是软件开发中常见的开发模式,主要应用于后端,将程序划分为M模型、V视图、C控制器从而便于团队协作开发,减少代码冗余

谈你对MVVM理解:

Model层代表数据模型、
View层代表UI组件、ViewModel是Model、View层的桥梁,数据会绑定到ViewModel并监控模型数据变化自动更新同步到页面,视图变化会通知ViewModel层更新数据。

谈谈MVVM和MVC区别:

相同点:都是软件开发常见的开发模式或者开发思想

不同点:

1- MVC后端居多,MVVM前端
2- MVC单向通信 目的将M和V代码分离,MVVM则是双向通信,不需要手动操作DOM

说一下v-show、v-if的区别:

都可以控制元素隐藏显示,v-if语法更强、控制DOM、v-show控制CSS

高频切换例如二维码、登录弹框、提示框、删除提示框、tab选项卡,推荐使用v-show 来减少DOM频繁删除创建所产生的额外性能开销

判断循环v-if、v-for优先级:

在 vue 2中,在一个元素上同时使用 v-ifv-for 时,v-for的优先级高于v-if     缺点:会产生不必要的性能开销

而在 vue 3 中, v-if的优先级高于v-for            vue3 解决了这个问题,v-if判断为false 后,不会执行v-for

说一下v-model原理:

v-model其底层是基于【:value】和【@input】 封装的语法糖

VUE2响应式原理(中级):

Vue初始化数据时,底层会通过Object.defineProperty对data中的模型数据进行数据劫持,数据变化会通知进行更新操作。

VUE2响应式原理(高级):

底层通过Object.defineProperty进行数据劫持结合   发布订阅模式      通知视图更新。

(Vue是采用数据劫持结合发布/订阅模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调。)

VUE2响应式数据无法劫持原因、和解决方案:

Object.defineProperty    不支持  复杂数据类型   劫持

对象递归 、数组重写 、额外api ($forceUpdate() 、$set)

$forceUpdate 原理:

调用 notify()  强制视图更新

$set 原理:

defineReactive(this.data数据, 要劫持得数组索引或对象键, 默认值)     建立响应式依赖    指定数据更新

VUE3响应式原理:

proxy 构造函数结合 Reflect 内置对象 拦截

-Object.defineProperty 拦截的是对象的属性,会改变原对象。 proxy 是拦截整个对象,通过 new 生成一个新对象,不会改变原对象。
- proxy 语法更强,拦截方式除了上面的 get 和 set ,还有 11 种,以前就6个
- proxy 特性更强,可以监听未定义的,针对于N层则get时判断递归添加proxy拦截即可

Vue面试题01的更多相关文章

  1. Java设计模式面试题 01 - 六大原则

    Java设计模式面试题 01 - 六大原则 1. 单一职责原则 Single Responsibility Principle SRP原则 分清职责,接口一定要做到单一职责,方法也要做到,类尽量做到 ...

  2. 2019前端面试系列——Vue面试题

    Vue 双向绑定原理        mvvm 双向绑定,采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty()来劫持各个属性的 setter.getter,在数 ...

  3. php开发面试题---vue面试题(vue.js的好处及作用)

    php开发面试题---vue面试题(vue.js的好处及作用) 一.总结 一句话总结: 双向数据绑定:在做ajax的时候,更新实在是太方便了 用数据绑定的思想,vue可以简单写单个页面,也可以写一个大 ...

  4. Java实现 LeetCode 面试题 01.07. 旋转矩阵(按照xy轴转+翻转)

    面试题 01.07. 旋转矩阵 给你一幅由 N × N 矩阵表示的图像,其中每个像素的大小为 4 字节.请你设计一种算法,将图像旋转 90 度. 不占用额外内存空间能否做到? 示例 1: 给定 mat ...

  5. Vue 面试题汇总

    Vue 面试题汇总 refs xgqfrms 2012-2020 www.cnblogs.com 发布文章使用:只允许注册用户才可以访问!

  6. 【前端面试】Vue面试题总结(持续更新中)

    Vue面试题总结(持续更新中) 题目参考链接 https://blog.csdn.net/weixin_45257157/article/details/106215158 由于已经有很多前辈深造VU ...

  7. 法门扫地僧总结vue面试题(部分来源网络)

    Front-End 前端开发工程师面试宝典!   (本文部分有转载,不定期更新!)             前言(README.md) 本仓库是我整理的前端常见面试题,大部分由我整理,其中个别部分参考 ...

  8. Vue面试题整理

    1:什么是MVVM MVVM是是Model-View-ViewModel的缩写,Model代表数据模型,定义数据操作的业务逻辑,View代表视图层,负责将数据模型渲染到页面上,ViewModel通过双 ...

  9. vue面试题总汇

    active-class是哪个组件的属性? vue-router模块的router-link组件. 嵌套路由怎么定义? 在实际项目中我们会碰到多层嵌套的组件组合而成,但是我们如何实现嵌套路由呢?因此我 ...

随机推荐

  1. PTA 面向对象程序设计 7-1 2017Final 圆周率山

    7-1 2017Final 圆周率山 为了参加学校的社团风采展,怡山小学数学组的同学们决定画一座圆周率山,以宣传圆周率. 已知圆周率为:3. 1415926535 8979323846 2643383 ...

  2. 关于在.H文件中定义变量

    KEIL中,在".H"文件定义变量. 如果该".H"文件同时被两个".C"文件调用,则会出现重复定义错误(*** ERROR L104: M ...

  3. webpack4 使用babel处理ES6语法的一些简单配置

    一,安装包 npm install --save-dev babel-loader @babel/corenpm install @babel/preset-env --save-devnpm ins ...

  4. Shell系列(28)- 条件判断之字符串判断

    字符串判断 $变量时要用双引号引起来,即"$变量" 测试选项 作用 -z 字符串 判断字符串是否为空(为空返回真) -n 字符串 判断字符串是否为非空(非空返回真) 字符串1 == ...

  5. FormData上传文件 带进度条

    * jQuery ajax  FormData 上传文件 template $.ajax({ url: url, type: 'POST', data: new FormData(form), dat ...

  6. Appium 自动化测试改造思路

    流水账脚本 从头到尾编写测试脚本 PO封装 业务行为与操作具体页面元素分离 basepage封装 如封装find方法,目的时增强稳定性 数据驱动封装 将常用的数据改为配置文件 为构建测试平台打基础

  7. 启动springboot出现错误 Caused by: java.net.BindException: Address already in use: bind

    如果运行过程中出现端口被占用 抛出了这个异常 首先可以在cmd中调出命令窗口然后 执行命令 netstat -ano  可以查看所有活动的连接  找到你被占用的端口 可以看到我被占用的端口的进程是 4 ...

  8. P4091-[HEOI2016/TJOI2016]求和【斯特林数,NTT】

    正题 题目链接:https://www.luogu.com.cn/problem/P4091 题目大意 给出\(n\),求 \[\sum_{i=0}^n\sum_{j=0}^i\begin{Bmatr ...

  9. Unity——观察者模式

    观察者模式 一.Demo展示 二.设计思路 我们假设一种情况,在app中修改了头像,在所有显示头像的UI中都需要更改相应的图片,一个个去获取然后调用刷新会非常麻烦: 因此我们需要一个自动响应机制--观 ...

  10. Python技法2:函数参数的进阶用法

    1.关键字参数(positional argument)和位置参数(keyword argument) Python函数的参数根据函数在调用时(注意,不是函数定义时)传参的形式分为关键字参数和位置参数 ...