2024年前端最新Vue一到三年面试题总结

2024年前端最新Vue一到三年面试题总结

码农世界 2024-05-21 前端 63 次浏览 0个评论

最后

前端CSS面试题文档,JavaScript面试题文档,Vue面试题文档,大厂面试题文档

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

7.active-class是哪个组件的属性?

答案:vue-router模块的router-link组件。

8.vue嵌套路由怎么定义?

答案:vue定义嵌套路由详细步骤讲解(附代码)

9.怎么定义vue-router的动态路由?怎么获取传过来的动态参数?

答案:

在router目录下的index.js文件中,对path属性加上/:id。

使用router对象的params.id获取参数。

10.vue-router有哪几种导航钩子?

答案:三种:

第一种:是全局导航钩子:router.beforeEach(to,from,next),作用:跳转前进行判断拦截。

第二种:组件内的钩子。

第三种:单独路由独享组件。

11.iframe的优缺点?

答案:iframe也称作嵌入式框架,嵌入式框架和框架网页类似,它可以把一个网页的框架和内容嵌入在现有的网页中。

优点:

  • 解决加载缓慢的第三方内容如图标和广告等的加载问题
  • Security sandbox
  • 并行加载脚本
  • 方便制作导航栏

    缺点:

    • iframe会阻塞主页面的Onload事件
    • 即使内容为空,加载也需要时间
    • 没有语意

      12.请讲讲你对axios或者其他请求方式的使用。

      答案:axios在vue项目中的使用

      13.axios+tp5进阶中,调用axios.post(‘api/user’)是进行的什么操作?axios.put(‘api/user/8′)呢?

      答案:跨域,添加用户操作,更新操作。

      14.vuex是什么?怎么使用?哪种功能场景使用它?

      答案:vue框架中状态管理。在main.js引入store,注入。新建了一个目录store,…… export 。场景有:单页应用中,组件之间的状态。音乐播放、登录状态、加入购物车。

      15.mvvm框架是什么?它和其它框架(jquery)的区别是什么?哪些场景适合?

      答案:一个model+view+viewModel框架,数据模型model,viewModel连接两个

      区别:vue数据驱动,通过数据来显示视图层而不是节点操作。

      场景:数据操作比较多的场景,更加便捷

      16.自定义指令(v-check、v-focus)的方法有哪些?它有哪些钩子函数?还有哪些钩子函数参数?

      答案:全局定义指令:在vue对象的directive方法里面有两个参数,一个是指令名称,另外一个是函数。组件内定义指令:directives

      钩子函数:bind(绑定事件触发)、inserted(节点插入的时候触发)、update(组件内相关更新)

      钩子函数参数:el、binding

      17.vue-router是什么?它有哪些组件?

      答案:vue用来写路由的一个插件。router-link、router-view

      18.导航钩子有哪些?它们有哪些参数?

      答案:

      导航钩子包括:

      a/全局钩子和组件内独享的钩子。b/beforeRouteEnter、afterEnter、beforeRouterUpdate、beforeRouteLeave

      参数:

      有to(去的那个路由)、from(离开的路由)、next(一定要用这个函数才能去到下一个路由,如果不用就拦截)最常用就这几种。

      19.请说下封装 vue 组件的过程?

      答案:首先,组件可以提升整个项目的开发效率。能够把页面抽象成多个相对独立的模块,解决了我们传统项目开发:效率低、难维护、复用性等问题。

      创建一个组件,然后使用Vue.component方法注册组件。子组件需要数据,可以在props中接受定义。而子组件修改好数据后,想把数据传递给父组件,可以采用emit方法。

      20.你是怎么认识vuex的?

      答案:vuex可以理解为一种开发模式或框架。比如PHP有thinkphp,java有spring等。

      通过状态(数据源)集中管理驱动组件的变化(好比spring的IOC容器对bean进行集中管理)。

      应用级的状态集中放在store中; 改变状态的方式是提交mutations,这是个同步的事物; 异步逻辑应该封装在action中。

      21.vue-loader是什么?使用它的用途有哪些?

      答案:解析.vue文件的一个加载器,跟template/js/style转换成js模块。

      用途:js可以写es6、style样式可以scss或less、template可以加jade等

      22.请说出vue.cli项目中src目录每个文件夹和文件的用法?

      答案:assets文件夹是放静态资源;components是放组件;router是定义路由相关的配置;view视图;app.vue是一个应用主组件;main.js是入口文件

      23.聊聊你对Vue.js的template编译的理解?

      答案:简而言之,就是先转化成AST树,再得到的render函数返回VNode(Vue的虚拟DOM节点)

      24.vue.cli中怎样使用自定义的组件?有遇到过哪些问题吗?

      答案:第一步:在components目录新建你的组件文件(smithButton.vue),script一定要export default 将组件导出。

      第二步:在需要用的页面(组件)中导入:import smithButton from ‘…/components/smithButton.vue’

      第三步:注入到vue的子组件的components属性上面,components:{smithButton}

      第四步:在template视图view中使用,

      问题有:smithButton命名,使用的时候则smith-button。

      25.dom是在哪一个生命周期完成渲染的?

      答案:在 mounted 中就已经完成了

      26.第一次页面加载会触发哪几个生命周期?

      答案:第一次页面加载时会触发 beforeCreate, created, beforeMount, mounted 这几个生命周期。

      性能优化

      1.webpack打包文件体积过大?(最终打包为一个js文件)

      2.如何优化webpack构建的性能

      3.移动端的性能优化

      4.Vue的SPA 如何优化加载速度

      5.移动端300ms延迟

      6.页面的重构

      所有的知识点都有详细的解答,我整理成了280页PDF《前端校招面试真题精编解析》。

      开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

      FFFFFF,t_70)

转载请注明来自码农世界,本文标题:《2024年前端最新Vue一到三年面试题总结》

百度分享代码,如果开启HTTPS请参考李洋个人博客
每一天,每一秒,你所做的决定都会改变你的人生!

发表评论

快捷回复:

评论列表 (暂无评论,63人围观)参与讨论

还没有评论,来说两句吧...

Top