前言
Hi,我是老吴
最近在忙碌于面试,所以疏忽于写文章;已经上岸了,所以后续有时间会再继续完成我的系列文章,如果还没看过的也可以顺便看看我的专栏文章:《vitepress趣玩系列》 《nuxt3拆包剖析》,你们的支持是我更文的最大动力~
省流
我想先介绍下本人的一些情况,让读者有个大概印象
本人双非本科,目前在深圳某公司上班,工作经验4年,主要从事前端工作,也有后端开发经验,公司内大部分工作以全栈为主,也担当过项目经理,顺便也做过测试,还有发布上线经验
总结来说,算是个全干工程师(一份工资。
应该从4月份开始正式找工作,历经3个月上岸,期间投过很多简历都石沉大海,确实感受到行情的凉气,大部分是通过牛客私聊拿内推方式,不回消息的话就自己在官网投,试过一段时间用“boss直骗”,拿到简历就跑。。
个人感受如下:
- 确实不要轻易裸辞;大部分是简历石沉大海,少部分面到最后涨幅不高
- 个人使用vue,但公司需要的是react;我这里不是引战,确实是在最后反问面试官技术栈的时候大部分是使用的react
- 没有八股文;应该说是没有纯八股文的面试,可能年限在那,并且项目写的比较多(4个),基本上都是问项目,然后从项目开始深入挖
- 算法很重要;连常见js手写题都少见,很经常给你甩个lc题目截图,没有hard,middle居多,easy也有
下面总结下我面试过的公司的问题,其实大部分都是从我项目出发,所以并不是一份通用的面试题帖子
微信
一面
- 介绍一下你的项目
- 说一下你这个项目的难点
- 你这个项目用到的水印功能是怎么处理的
- 你这个项目的懒加载图片组件是怎么封装的
- 把图片懒加载组件,再封装成懒加载瀑布流,需要怎么做
- 怎么统计一个图片的加载时间是否缓慢
- 说一下你理解的组件封装思路
- (第二个项目)我看你使用了微前端框架qiankun,有了解过里面的一些原理吗
- qiankun的js沙箱隔离和css隔离原理
- qiankun的css隔离有什么问题,需要怎么解决
- 你的微前端重构,是基于什么方向去进行应用拆分
- 如何管理微前端的各个应用,为什么不使用monorepo
- (第三个项目)说下你这个项目遇到的难点,针对这些痛点,如何解决
- webpack-dev-server如何实现这个拦截,怎么思考到这个拦截处理的方案
- 这个我可以简单解释一下,我是利用了webpack-dev-server的拦截,实现了本地登录页,解决了本地开发的认证问题
- (实现方案有借鉴vite的处理)说下对vite的理解,跟webpack的区别
- (第四个项目)组件库怎么做技术选项
- 组件库的按需引入功能实现
- 组件库的主题定制功能实现
- 对比于市面上的组件库,你的库的优势或者亮点是什么
- 手撕三道题
- 给你个对象数组[{age: 18, name: 'xx'}],不使用sort,按年龄由小到大排序,年龄相同就按姓名首字母排序
- Promise并发处理,要求尽可能快的返回第一个校验不通过的结果,如果都通过,则返回全部通过的结果
- 深拷贝
小结
由于是第一场面试,导致回答的其实不是很好,也止步于一面
手撕题也没写出最优解,第一题其实就是考察排序方法,快排更佳,第三题也需要考虑多种类型处理,循环引用处理等细节点
tips:面腾讯最好要做好准备再去,如果面评不好,后续再投递可能就不会再收你简历了
朴朴
朴朴有点特殊,一面是两个面试官,一个问完到另一个
一面
- 介绍下个人技术栈和了解过的比较新的技术
- 介绍下第一个项目
- 之前是vue开发的,后续怎么重构成react
- 说到使用umi重构,能介绍下umi的一些特性吗
- 如何进行重构,重构过程中的难题如何解决
- 介绍下权限控制方案,如何对接,权限信息如何传递
- 为什么使用jwt,jwt的组成部分简述下
- 如何推广你的这个模板工程
- 后续如果需要你升级这个模板工程,从哪方面入手
- 说一下对class组件和function组件的理解
- 为什么hook不能写在if中
- 说一下useEffect,多个子组件和兄弟组件,useEffect的执行时机
- 说一下useEffect和useLayoutEffect区别
- 说下reconciler的流程
- 用过ts吗
- type和interface的区别
- any和unknown区别
- 说下xss,实际项目中如何处理
- 说下csrf,实际项目中如何处理
- 9个div实现3x3布局的方法
- 说下了解的数据结构
- 说下数组转树的思路和步骤
- 看你重构了多个项目,如何保证重构后的功能稳定
- 重构的目的是什么
- 你们这个系统的底层框架为什么选择vue2,而不是使用vue3
- 如何排查和解决系统重构后带来的生产问题
- 有了解过监控系统是怎么收集信息的吗
- 如何进行组件封装
- 有什么好的开发习惯能介绍下吗
- 这个开发习惯,能否结合eslint进行代码控制
- 说一下微前端框架的子应用拆分逻辑
- 说一下离职原因
小结
两个人一起面属实没遇到过,第一个偏向基础和八股,后面一个偏向实战,也有不错的面试体验,就是没看过八股 :)
快手
一面
- 有了解过你们公司内部的小程序框架吗
- 跟微信小程序相比有什么区别呢
- 能介绍下第二个项目的业务逻辑吗
- 我看你这个系统涉及到多种业务状态,如何管控好这些状态
- 你这个系统用户量不小,如何保证系统在海量用户下的稳定性
- 如何快速定位线上问题
- 前端的异常是如何收集的,异常信息怎么上送到监控平台
- 怎么去实现一个监控平台
- 如何收集生产环境的一些页面数据,比如FCP,CLS
- 监控系统有告警功能吗,有了解过如何保证高效快速告警吗
- 介绍下第三个项目中你们公司的底层框架
- 有进行移动端页面的优化吗
- 你说到有使用虚拟列表优化业务场景,能说下原理吗
- 虚拟组件的快速滑动会有白屏情况,如何优化
- 组件库的按需引入如何实现
- 按需引入的原理是什么,为什么会有按需引入的做法
- 有了解过tree shaking的sideEffect吗
- (第一个项目)你实现的模板工程介绍一下
- 后续的迭代还能做什么优化,如何保证在每次工程有更新有新功能的时候,对接系统也能使用上新功能
- 介绍下你写的vue插件,vue插件的原理是什么,你的插件实现了什么功能
- 水印组件的最佳实现
- 手撕,三数之和
小结
感觉这面内容虽然不多,但考得比较深,更考察你的知识广度
一开始问到了我小程序框架内容,其实我并没有做过类似的项目,所以我一开始并没有答好,估计是面试官看错了,所以建议项目经历要写清楚一点,不能模棱两可,问错了方向内容后续都回答不好
二面
- 看你以前是做后端的,为什么后来选择从事前端
- 前端从什么方向入手学习,现在还如何提升自己的前端技术
- vue和react的区别
- 不小心提了嘴solid和svelte,面试官顺便问了下这两个的内容
- 翻了我的掘金,让我说下我理解的nuxt3
- nuxt和next的了解
- 项目中微前端框架的选型,如何进行应用拆分
- 子应用加载过慢,如何优化
- qiankun的实验模式css沙箱隔离方案,深入探讨了下其中的css原理
- 介绍下umi,顺带提了嘴father(阿里的人可真会起名字
- 说下umi的约定式路由和nuxt的约定式路由
- 说下给项目中底层框架的痛点解决过程,优化思路,最终落地及推广
- 手撕,乘积最大子数组
小结
感觉像在聊天,时间不长,但挺愉快
美团
一面
- 挑一个项目能体现出你的能力和工作水平的项目介绍一下
- 针对项目中的痛点,如何解决
- 有没有什么痛点,被你发现了,但还没有解决,后续针对该痛点如何进行学习
- 在业务开发过程中,如何进行自我提升
- (看了我的github)发现你每天都有提交,怎么做到的
- 介绍下github actions
- 介绍下组件库项目,说下技术选型
- 组件库开发过程中的一些难点
- 主题功能,用户如何控制实现他们自己的主题(客制化主题)
- 后续对组件库的优化,思路
- 问了个vue2的问题,定义了一个computed,但template中没有使用该computed,那么该computed是否会被计算
- 什么时候使用vuex,如何管理全局状态,如何处理mutations和actions
- 手撕,给了个js题
const x = { a: { b: { c: 1, f: 3 } } }
const y = { a: { b: { c: 1, k: 3 } } }
Object.myAssign(x, y) => { a: { b: { c: 1, k: 3, f: 3 } } }
Object.myAssign = (x, y) => {
// 实现
}
小结
过程比较简短,问题也中规中矩
二面
- 介绍下你的掘金文章
- 讲下你的技术栈
- 介绍下你在公司中的工作内容,B端多还是C端多
- 问我知道我投的是北京岗吗,为什么想去北京
- 介绍下xxx系统的整体架构
- 介绍下重构后系统的前端底层框架内容
- 针对重构过程中的痛点,如何解决
- 介绍下对你提升较大的项目
- 讲下你对底层框架优化的工作内容
- 用了什么工具封装的脚手架,有什么功能,开发这个功能的目的是什么
- 讲到了我使用了webpack-dev-server的功能对前端框架提效,拓展到我从看vitepress源码中得到的灵感balabala
- 还面了什么公司,拿到几个offer
- 手撕,查找给定数组中出现次数最多的字符并打印输出;示例: [a,b,c,d,d,d,d,e,a,b,c,c,f,g,d],边写边问思路,问能不能优化,问如果xxx结果会怎样
小结
感觉也像闲聊,更多的看你的思维和思考吧
顺带提了嘴他们是react的
金山wps
第一个一面
- 问了我英语几级(我的天,居然还会看这个
- 为什么离职
- 介绍下四个项目
- 说一下对工程化的理解
- 说一下组件封装思想
- 介绍下你风险最大的工作内容,针对这个风险怎么做防范措施,保证风险尽可能不发生
- 介绍下技术上比较难的内容
- 针对你说的vitepress文档简陋这个问题,你怎么解决这个难题,不可能每次有问题都查阅源码吧(有可能的。。
- 说下对vite的理解
- 说了下基于create-vite封装的小工具的实现内容,讲解了开发这个轮子的原因,遇到的难题的解决方法,修改源码的方式,npm发布问题balabala
- 说一下常用的性能优化方案,结合具体的项目讲解
- chrome performance的使用
- 介绍下微前端的选型到工程落地的过程
- 为什么要用qiankun(火啊。
- 说下优缺点(wow,一面也会问吗
- 说下期望薪资,介绍下目前的薪资结构
- 说下兴趣爱好(王者
- 现在几颗星了(突然觉得这家公司不错
- 讲解下如果让我独立承担大型开发模块,会怎么做
第二个一面
- 说下用过的打包工具(webpack rollup vite esbuild tsup unbuild
- 说下这些工具的代码转换过程
- 有没遇到过代码转换过程中的问题,兼容性问题,针对兼容性问题的解决方案
- 讲一下业务难题,解决方案
- 介绍下项目
- 突然就闲聊了,问我有没有女朋友之类的,然后客套了一下说如果没有我来他们这会挺抢手,金山的妹子多(惊。。
小结
第一次遇到一面还分两部分的,第一部分偏向技术问题,第二部分闲聊多一点,还说到我的简历编排内容不太好,让我回去改改
二面
- 讲下微前端,应用拆分逻辑和情况
- 介绍下有挑战性的项目
- 介绍下组件库,说下技术选型和方案,对比市面上的竞品的优势
- 有独立开发经验吗,在多人协作的时候怎么安排
- 后端经验如何
- 讲解了下前端发展趋势
- 有没有带人或者管理经验
- 说下性能优化,尽可能多维度讲解,怎么看指标
- 手撕,两个栈模拟队列
小结
闲聊
三面
- 项目讲解
- 重构系统的思路,如何保证重构后的稳定性
- 重构过程中的优化,及规范控制
- 有什么优势
- 对未来的打算,如果入职了会怎么安排
- (讲到了静态文档框架)说下实现静态文档框架的思路
小结
闲聊
深信服
一面
- 让我写一个card组件,并且有三点要求(忘了
- 说下这个card组件从编译到渲染的整体过程
- 介绍下组件库,技术选型
- 如何维护组件库文档,让文档保持最新
- 如何保证组件多次迭代后的稳定性(单测
- 介绍下封装webpack的过程
- 手撕,lazyman
小结
中规中矩,项目问题问的比较少,八股偏多,lazyman也常见
二面
- 介绍第一个项目xx模板工程,项目的背景和意义
- 三栏布局的方案用的什么
- 权限控制方案,使用jwt的优势
- 懒加载列表的实现,处理什么场景,如何做到更好(虚拟列表
- 介绍下项目中的vue插件,原理,方案,提效效果
- 用vue3实现过什么项目,有什么亮点
- 主题控制
- 如何实现有有效期的storage,怎么清除全部过期数据
- 组件库的工程结构,为什么这样划分,使用jsx实现的原因是什么
- 有使用单测吗
- 按需引入方案
- 手撕,反转链表,时间空间复杂度
小结
很八股的感觉,但会深挖一点项目内容
三面
- 说下最有挑战的项目
- 如何发现痛点,解决痛点思路
- 后面都是问项目了
小结
没小结
富途
一面
- 介绍下第一个项目xx模板工程,拓展到后续的优化改造,结合umi和nuxt的做法进行工程化控制
- 为什么微前端项目的子应用有vue也有react(因为我突然想写react。
- react子应用为什么使用umi(qiankun跟umi一家的,这不刚好用一下
- 说下umi的功能,约定式路由
- 说下组件库,用的什么打包工具,整体的技术选型
- 组件库开发过程中的一些难点,如何解决
- 延伸了市面上的打包工具,聊了下现代前端工具的发展趋势
- 聊了下nuxt,聊了下unjs小作坊的工具(应该是看到我的掘金文章才问的
- 聊了下csr,ssr,ssg
- 对node的使用经验,拓展到现在的脚手架写法,顺便聊了下一些后端框架的封装处理
- 聊一下公司的前端框架内容,聊到我的共建内容
- 针对业务场景的痛点,如何解决
- 聊到移动端h5开发,客户端接口的调用
- 针对客户端接口的异常处理方法,如何统计客户端接口调用时长,能不能收集缓慢接口数据
- 如何收集页面的性能指标
- 微前端项目的技术选型,聊了下qiankun的获取子应用数据原理
- qiankun对比single-spa的优化点
- qiankun的js沙箱和css样式隔离方案原理,沙箱隔离的原因
- 手撕,两个有序数组合并,时间空间复杂度,能不能优化
小结
闲聊,手撕也简单
二面
- 聊项目,说了下市面上的微前端框架类型,阿里的qiankun,腾讯的wujie,京东的micro-app
- 问了10分钟就来手撕了。
- 递归实现两个整数的乘积,要求不使用‘*’号(即乘号)
- 写一个函数,输入是正奇数n,输出1-n^2的二维数组,要求按照一定规律排列
/**
* 输入3
* [
* [5,4, 3],
* [6, 1, 2],
* [7, 8, 9]
* ]
*/
- 智力题,抛硬币,先抛的人赢的概率
小结
没见过一上来就直接手撕的面试,第二题因为没接触过螺旋矩阵的处理,完全没思路,面试官也留了很多时间让我写,还是写不出来哈哈
三面
- 项目介绍
- 做题(???你们富途都这样操作的吗
- 给了个场景题,这个页面的布局思路,接口方案,从网络请求开始到拿到数据到展示数据的整个过程,一些异常场景的处理,怎么优化,为什么是这个方案
- 如何优化客户体验,有没有看过相关的文章
- 有没有抓过包,为什么抓包工具能拿到https网站的数据,https的流程
小结
二三面都是以做题为主,真是脱一层皮。
总结
还有些面试感觉内容雷同,就不写了
以上内容均出自本人记忆,可能有的问题看着会很奇怪,没关系,你是对的
答案就随缘吧,本来也没想写这么多,写着写着写了三天。。也看出我后面写的越来越敷衍哈哈哈
后续可能会把剩下的面试也补充上,欢迎点赞加收藏~