前端面试大全2019

1、对mvvm模式的理解?
mvvm是model view viewModel的缩写 model 是数据模型 定义数据修改和操作的业务逻辑 view是ui组件 将数据模型转换成Ui展现出来 viewModel监听模型数据的改变 控制视图行为 处理用户交互 通过双向数据绑定将view和model连接起来 view和model之间的同步是自动的 无需人为干涉 所以开发者只需要关注业务逻辑而不需要操作dom 更无须关注数据状态的同步问题 复杂的数据状态维护就交给mvvm统一管理。

2、vue生命周期?
vue实例从创建到销毁的过程,就是生命周期。 也就是从开始创建、初始化数据,编译模板、挂载DOM —渲染、更新—渲染、卸载等一系列过程,称为Vue的生命周期 分为 8个阶段 创建前后 载入前后 更新前后 销毁前后。
BeforeCreate 组件实例刚刚被创建,获取不到props或者data中的数据,这些数据初始化都在initState中。
Created 实例已经被创建完成之后调用,可以访问到之前不能访问到的数据,但是组件还没有被挂载。
BeforeMount 挂载开始之前被调用。
Mounted dom节点被渲染到文档内,一些需要dom的操作在此时才能正常进行。
BeforeUpdate 数据更新时调用,发生在虚拟dom重新渲染之前 在这个钩子中进一步地更改状态 不会触发附加的重渲染过程
Update 组件DOM已经更新,可以执行依赖于DOM的操作,但应该避免在此期间更改状态 有可能会导致更新无限循环。
BeforeDestory 实例销毁之前调用,实例仍然可以调用。
Destroyed 实例被销毁后调用 调用后vue实例指示的所有东西都会解绑,事件监听器会被移除,所有子实例也会被销毁,该钩子在服务器端渲染期间不被调用。

3、Vue实现双向数据绑定的原理?
vue数据双向绑定是通过数据劫持结合发布者-订阅者模式的方式来实现的,通过劫持object.defineProperty()中的set和get属性。

4、Vue组件间传递参数?
父组件给子组件:父组件通过子标签绑定的属性,子组件通过props接收
子组件给父组件:子组件通过emit将值传给父组件,父组件监听子组件触发的事件 兄弟通信:this.parent.children 在children中可以通过组件name查询到需要的组件实例,然后传值

5、React和Vue的区别?
相同:都支持服务器端渲染,组件化开发通过props参数进行父子组件数据的传递,数据驱动视图,
不同:vue是双向数据绑定,react数据流动是单向的。Vue渲染过程是跟踪每一个组件的依赖,更改了哪个组件渲染哪个,react重新渲染全部组件

6、对keep-alive的了解?
是Vue的内置组件,可以使被包含的组件保留状态,避免重新渲染
拥有两个独有的生命周期钩子函数,activated和deactivated
被包裹在keep-alive中的组件的状态将会被保留,例如我们将某个列表类组件内容滑动到第100条位置,那么我们在切换到一个组件后再次切换回到该组件,该组件的位置状态依旧会保持在第100条列表处

7.<keep-alive></keep-alive>的作用是什么?
<keep-alive></keep-alive> 包裹动态组件时,会缓存不活动的组件实例,主要用于保留组件状态或避免重新渲染。
大白话: 比如有一个列表和一个详情,那么用户就会经常执行打开详情=>返回列表=>打开详情…这样的话列表和详情都是一个频率很高的页面,那么就可以对列表组件使用<keep-alive></keep-alive>进行缓存,这样用户每次返回列表的时候,都能从缓存中快速渲染,而不是重新渲染

8、route和router的区别?
route是路由信息对象,包括path params query name等路由信息参数router是路由实例对象,包括了路由的跳转方法,钩子函数等
query和params的区别:query相当于get请求,页面跳转的时候可以在地址栏看到请求参数,用path来引入;params相当于post,地址栏不显示参数 用name来引入
路由的钩子函数:beforEach
to:即将要进入的目标 包括的属性(path params query name meta matched fullPath)

9、vue常用的修饰符?
.prevent 阻止元素默认跳转 .stop 阻止单击事件冒泡 .capture捕获 .once 只执行一次

10、怎么定义vue-router的动态路由以及如何获取传过来的动态参数?
在router目录下的index.js文件中,对path属性加上/:id
使用router对象的params.id

11、vue+axios登录拦截
在定义路由的时候加上requireAuth,判断该路由的访问是否需要登录 如果已经登录则顺利进入页面。定义完路由后利用vue-router提供的钩子函数beforeEach()对路由进行判断 判断是否需要登录权限,判断是否存在token
想要统一处理所有http请求和响应,用axios拦截器 通过配置http response inteceptor ,当后端返回401时,则未授权 让用户重新登录

12、Vuex是什么?怎么使用?哪种功能场景使用它?
只用来读取的状态集中放在sotre中,改变状态的方式是提交mutations,这是个同步事物;异步逻辑应该封装在action中
组件渲染之后,与用户产生交互,触发一些行为(dispatch ---->action),这些行为会提交一些修改数据的行为(commit ---->mutations), 这些行为会主动修改状态(state)中的数据,状态数据的改变会更新组件

13、vue路由原理
只有2种实现方式 hash模式和history模式
hash模式:带#号的,当#后面的哈希值发生变化时,可以通过hashchange事件来监听到URL变化,进行页面跳转(简单,兼容性好)
history模式:h5新功能,使用history.pushState和history.replaceState改变URL

14、computed和watch区别
computed是计算属性,依赖其他属性计算值,并且computed的值有缓存,只有当计算值变化才会返回内容
Watch监听到值的变化就会执行回调,在回调中进行一些逻辑操作
一般需要依赖别的属性来动态获得值的时候可以使用computed
对于监听到值的变化需要做一些复杂业务逻辑的情况可以使用watch

15、v-if和v-show的区别
v-show 只是通过设置dom元素的display控制显示隐藏
V-if 是动态的添加或删除dom元素

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,088评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,715评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,361评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,099评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 60,987评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,063评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,486评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,175评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,440评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,518评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,305评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,190评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,550评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,880评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,152评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,451评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,637评论 2 335

推荐阅读更多精彩内容

  • 一:什么是闭包?闭包的用处? (1)闭包就是能够读取其他函数内部变量的函数。在本质上,闭包就 是将函数内部和函数外...
    xuguibin阅读 9,436评论 1 52
  • VUE Vue :数据驱动的M V Vm框架 m :model(后台提供数据),v :view(页面),vM(模板...
    wudongyu阅读 5,353评论 0 11
  • AngularJS是什么? AngularJs(简称ng)是一个用于设计动态web应用的结构框架。首先,它是一个框...
    强哥科技兴阅读 1,250评论 0 1
  • 1、active-class是哪个组件的属性?嵌套路由怎么定义? 答:vue-router模块的router-li...
    黄海佳阅读 1,911评论 1 38
  • Vue知识点的总结 Vue中的指令及其基本语法: 第一步:从官网上下载vue开发版本的js文件 引入js文件 ...
    往前走莫回头_2cd6阅读 1,441评论 0 1