前言
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的流程
小结
二三面都是以做题为主，真是脱一层皮。
总结
还有些面试感觉内容雷同，就不写了
以上内容均出自本人记忆，可能有的问题看着会很奇怪，没关系，你是对的
答案就随缘吧，本来也没想写这么多，写着写着写了三天。。也看出我后面写的越来越敷衍哈哈哈
后续可能会把剩下的面试也补充上，欢迎点赞加收藏~
