96道前端面试题，实战案例

红太狼 2022-10-05 10:57 159阅读 0赞

## 背景 ##

我18年本科毕业，年前已有换工作想法，一直没有付诸行动，疫情爆发后回到老家，年后开始找工作，对于自己水平不是很清楚，之前找工作一直都挺顺利的。大学毕业没有留在实习单位继续做前端开发，那时候三大框架已经开始流行了，实习公司用的还是jquery。回老家学了一个月的车和vue、小程序后，凭着自学做的项目找了一周工作入职第一家公司。面试经验比较少，想着多面面看看对方公司的反馈。年前还没开始准备就面了腾讯，终止于二面，所以说还是要好好复习再面大厂。

面的岗位以两三年为主，虽然我是1.5年经验，但有的岗位年限要求没那么严格也可以试试，尤其写的优秀者可放宽年限要求。面了四五家，有上市公司，也有小公司，都是远程面试。

## vue核心知识点 ##

##### 1、对于Vue是一套渐进式框架的理解 #####

##### 2、vue.js的两个核心是什么？ #####

##### 3、请问 `v-if` 和 `v-show` 有什么区别 #####

##### 4、vue常用的修饰符 #####

##### 5、v-on可以监听多个方法吗？ #####

##### 6、vue中 `key` 值的作用 #####

##### 7、vue-cli工程升级vue版本 #####

##### 8、vue事件中如何使用event对象？ #####

##### 9、$nextTick的使用 #####

##### 10、Vue 组件中 data 为什么必须是函数 #####

##### 11、v-for 与 v-if 的优先级 #####

##### 12、vue中子组件调用父组件的方法 #####

##### 13、vue中 `keep-alive` 组件的作用 #####

##### 14、vue中如何编写可复用的组件？ #####

##### 15、什么是vue生命周期？ #####

##### 16、vue生命周期钩子函数有哪些？ #####

##### 17、vue如何监听键盘事件中的按键？ #####

##### 18、vue更新数组时触发视图更新的方法 #####

##### 19、vue中对象更改检测的注意事项 #####

##### 20、解决非工程化项目初始化页面闪动问题 #####

##### 21、v-for产生的列表，实现active的切换 #####

##### 22、v-model语法糖的组件中的使用 #####

##### 23、vue中自定义过滤器 #####

##### 24、vue等单页面应用及其优缺点 #####

##### 25、什么是vue的计算属性？ #####

##### 26、vue-cli提供的几种脚手架模板 #####

##### 27、vue父组件如何向子组件中传递数据？ #####

##### 28、vue弹窗后如何禁止滚动条滚动？ #####

##### 29、计算属性的缓存和方法调用的区别 #####

##### 30、vue-cli中自定义指令的使用 #####

![Vue核心知识点][Vue]

### vue-router ###

##### 1、vue-router如何响应 路由参数 的变化？ #####

##### 2、完整的 vue-router 导航解析流程 #####

##### 3、vue-router有哪几种导航钩子（ 导航守卫 ）？ #####

##### 4、vue-router传递参数的几种方式 #####

##### 5、vue-router的动态路由匹配 #####

##### 6、vue-router如何定义嵌套路由？ #####

##### 7、`<router-link></router-link>`组件及其属性 #####

##### 8、vue-router实现路由懒加载（ 动态加载路由 ） #####

##### 9、vue-router路由的两种模式 #####

##### 10、history路由模式配置及后台配置 #####

![vue-router][]

> **CSS面试题文档，JavaScript面试题文档，Vue面试题文档，大厂面试题总结**，看文末可**免费**领取！

### vuex ###

##### 1、什么是vuex？ #####

##### 2、使用vuex的核心概念 #####

##### 3、vuex在vue-cli中的应用 #####

##### 4、在vue中使用vuex，修改state的值 #####

##### 5、vuex actions异步修改状态 #####

![vuex][]

### http请求 ###

##### 1、Promise对象是什么？ #####

##### 2、axios、fetch与ajax有什么区别？ #####

##### 3、什么是JS的同源策略和跨域问题？ #####

##### 4、如何解决跨域问题？ #####

##### 5、axios有什么特点？ #####

![http请求][http]

### UI样式 ###

##### 1、`.vue组件的scoped属性`的作用 #####

##### 2、如何让CSS只在当前组件中起作用？ #####

##### 3、vue-cli中常用的UI组件库 #####

##### 4、如何适配移动端？【 经典 】 #####

##### 5、移动端媒体查询 #####

##### 6、vue内容垂直和水平居中 #####

##### 7、vue-cli引入图片的方法 #####

##### 8、移动端常见样式问题 #####

##### 9、文本超出隐藏 #####

![UI样式][UI]

### 常用功能 ###

##### 1、vue中如何实现tab切换功能？ #####

##### 2、vue中keep-alive 实现标签页组件缓存 #####

##### 3、vue中实现页面从右往左侧滑入效果 #####

##### 4、vue中父子组件如何相互调用方法？ #####

##### 5、vue中央事件总线的使用 #####

![常用功能][fb43cdaad1daef13ad4e6c87f2a6689b.png]

### MVVM设计模式 ###

##### 1、MVC、MVP与MVVM模式 #####

##### 2、MVC、MVP与MVVM的区别 #####

##### 3、MVVM的实现原理 #####

##### 4、Object.defineProperty()方法 #####

##### 5、 ES6中定义的类和对象 #####

##### 6、JS中的文档碎片 #####

##### 7、解构赋值 #####

##### 8、Array.from #####

##### 9，Array.reduce #####

##### 10、递归的使用 #####

##### 11、Obj.keys()与Obj.defineProperty #####

##### 12、发布-订阅模式 #####

##### 13、vue项目优化，缩短首屏加载时间 #####

![MVVM设计模式][MVVM]

### 深入拓展 ###

##### 1、vue开发命令 npm run dev 输入后的执行过程 #####

##### 2、vue的服务器端渲染 #####

##### 3、从零写一个npm安装包 #####

##### 4、vue-cli中常用到的加载器 #####

##### 5、webpack的特点 #####

![深入拓展][c686782e6dc7a19d6c3400e7915423b3.png]

### 最后 ###

javascript是前端必要掌握的真正算得上是编程语言的语言，学会灵活运用javascript，将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识，而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的，直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后，发现暂时没有提升的空间，我们可以暂时放一放。继续下面的学习，javascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。

[**资料领取方式：点击这里免费领取前端全套学习资料**][Link 1]

![css源码pdf][css_pdf]

![JavaScript知识点][JavaScript]  
ascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。

[**资料领取方式：点击这里免费领取前端全套学习资料**][Link 1]

\[外链图片转存中…(img-T8AFR8ld-1623148390788)\]

\[外链图片转存中…(img-GjR9RHz2-1623148390789)\]

[Vue]: /images/20221005/fe0cad61d5be4fc2bb6970996d534f5b.png
[vue-router]: /images/20221005/cc794d3c521341208bf942639ff6440e.png
[vuex]: /images/20221005/dd32272bdff748b5b214fa5f5f2e8560.png
[http]: /images/20221005/b9e7b172df63487fb92b84d852faada4.png
[UI]: /images/20221005/c3874c175e564478a4feecede4b6d2d8.png
[fb43cdaad1daef13ad4e6c87f2a6689b.png]: /images/20221005/a33a2a4501d747d19f6f233b032c0f25.png
[MVVM]: /images/20221005/bc5588a6c959499eb323cdb45956f141.png
[c686782e6dc7a19d6c3400e7915423b3.png]: /images/20221005/88144fe3a0b6428abe4573c18d61596a.png
[Link 1]: https://docs.qq.com/doc/DSlNuUUFPWmpZVlJh
[css_pdf]: /images/20221005/1f56a2949c0845acada3ad1af3b85d3c.png
[JavaScript]: /images/20221005/3d7b17af359141bebc0f590751c895e5.png