当前位置: 首页 > Web前端 > CSS

前端面试大全2019年

时间:2023-03-31 12:02:30 CSS

1.对mvvm模式的理解?mvvm是modelview的缩写viewModelmodel是数据模型,定义了数据修改和操作的业务逻辑用户交互通过双向数据绑定将视图和模型连接起来,视图和模型之间的同步是自动的,不需要人为干预,所以开发者只需要关注业务逻辑,不需要操作dom,让单独数据状态的同步。复杂的数据状态维护交给mvvm统一管理。2.vue生命周期?vue实例从创建到销毁的过程就是生命周期。即从开始创建、初始化数据、编译模板、挂载DOM-渲染、更新-渲染、卸载等一系列过程,称为Vue的生命周期分为8个阶段:创建前和创建后,加载前后,更新前后,销毁前后。BeforeCreate组件实例刚刚创建,无法获取到props或data中的数据,这些数据都是在initState中初始化的。创建实例后调用created,可以访问之前访问不到的数据,但是组件还没有挂载。BeforeMount在挂载开始之前被调用。挂载的dom节点渲染到文档中,此时可以正常执行一些需要dom的操作。BeforeUpdate在更新数据时调用,这发生在虚拟DOM重新渲染之前。进一步更改此挂钩中的状态将不会触发额外的重新渲染过程。Update组件DOM已经更新,可以进行依赖于DOM的操作,但是要避免这期间状态的改变,有可能造成更新的死循环。BeforeDestory在实例销毁之前调用,实例仍然可以被调用。Destroyed在实例被销毁后调用。调用后,vue实例所指示的一切都将被解除绑定,事件监听器将被移除,所有子实例将被销毁。服务器端渲染期间不会调用此钩子。3、Vue是如何实现双向数据绑定的?Vue数据双向绑定是通过数据劫持结合发布订阅者模式实现的,通过劫持object.defineProperty()中的set和get属性。4.Vue组件之间传递参数?父组件到子组件:父组件通过子标签绑定属性,子组件通过props接收子组件给父组件:子组件通过emit传值给父组件,父组件监听给子组件触发的事件大哥交流:这个.parent.children在children中,可以通过组件名查询到需要的组件实例,然后传值5.React和Vue的区别?相同点:都支持服务端渲染,组件开发使用props参数传递父子组件数据,数据驱动视图,不同点:Vue是双向数据绑定,react数据流是单向。Vue渲染过程是跟踪每个组件的依赖关系,哪个组件改渲染哪个,react重新渲染所有组件6.keep-alive的理解?它是Vue的内置组件,可以保持被包含组件的状态,避免重新渲染。它有两个独特的生命周期钩子函数,activated和deactivated。包裹在keep-alive中的组件的状态将被保留。比如我们将一个类列表组件的内容滑动到第100个位置,然后切换到一个组件后又切换回这个组件,组件的位置状态仍然会停留在第100个列表。7.的作用是什么?包裹动态组件时,会缓存不活跃的组件实例,主要用于保持组件状态或避免重新渲染。大白话:比如有一个列表和一个详情,那么用户往往会打开详情=>返回列表=>打开详情...这样一来,列表和详情就是一个很频繁的页面,那么就可以使用列表组件进行缓存,这样用户每次返回列表时,都可以快速从缓存中渲染出来,而不是重新渲染8.两者的区别路由和路由器?route是路由信息对象,包括路径参数、查询名称和其他路由信息参数。router是一个路由实例对象,包括路由跳转方法,钩子函数等。query和params的区别:query相当于一个get请求,可以在页面跳转的时候查看地址栏中的请求参数,使用导入路径;params相当于post,地址栏不显示参数,使用name导入路由的hook函数:beforeEachto:要进入的目标包含的属性(pathparamsquerynamemetamatchedfullPath)9.常用的修饰符视图?.prevent默认阻止元素跳转.stop阻止点击事件冒泡.capture捕获.once只执行一次10.vue-router的动态路由如何定义,如何获取传入的动态参数?在router目录下的index.js文件中,在path属性中添加/:id并使用router对象的params.id11,vue+axios登录拦截,定义路由时添加requireAuth,判断是否访问route是需要登录的,如果已经登录的话,可以顺利进入页面。定义路由后,使用vue-router提供的钩子函数beforeEach()判断路由是否需要登录权限,是否有token。如果要统一处理所有的http请求和响应,使用axios拦截器配置http响应接受器。当后台返回401时,用户无权再次登录。12.什么是Vuex?如何使用?哪些功能场景使用它?只用于读取的状态集中在sotre中,改变状态的方式是提交mutations,这是一个同步的东西;异步逻辑应该封装在组件渲染后的action中,与用户交互,触发一些行为(dispatch---->action),这些行为会提交一些数据修改行为(commit---->mutations),这些行为会主动修改状态(state)中的数据,状态数据的改变会更新组件13.vue路由的原理只有hash模式和history模式hash模式2种实现方式:with#,when#变化后面的hash值,可以通过hashchange事件监听URL变化,进行页面跳转(简单,兼容性好)history模式:h5新功能,使用history.pushState和history.replaceState改变URL14,computedandwatch是不同的。computed是一个计算属性,它依赖于其他属性来计算值,并且计算值被缓存。只有当计算值发生变化时,才会返回内容Watchlistener当值发生变化时,才会执行回调。在回调中进行一些逻辑操作时,一般需要依赖其他属性动态获取值。您可以使用计算。对于需要做一些复杂的业务逻辑来监听值变化的情况,可以使用watch15,v-if和v-showv-show的区别只是通过设置显示和隐藏v-if显示dom元素的控件。v-if是动态添加或删除dom元素。想学前端的朋友可以关注+私信回复《资料》免费领取~感谢阅读!喜欢的话可以收藏转发哦~