转转前端面经
面经
校招面经,一面,面了五十分钟左右,快毕业的时候面的,感觉下来就是他会不会是赶着去吃中午饭,听得我讲有点不耐烦的样子,然后让我回答简洁一点,然后我听说很多人都能面上转转,然后有同学被hr面卡过,基本技术面不难听说
不过我觉得能约面试到饭点前这种时间的话,多半没好事
1. css怎么去实现垂直居中
2. 讲一下flex布局
3. css的transition有多少个属性
4. css的animation有多少个属性
5. js里面怎么去实现切割字符串,有多少种方式
6. react怎么去实现类似vue里keepalive的东西
7. 你怎么去设计一个前端异常监控平台
8. 你怎么去监控用户的行为路径并做记录
9. 你怎么去封装一个公共请求
10. 你重构后怎么去保证项目的可稳定性
11. 怎么去灰度发布
12. 代码上面怎么去做灰度
13. 你怎么去做一个公共的上传图片的组件
14. 实习期间最有成就感的事情
15. 反问
感受
总体来讲问得并不难,手撕算法都没有,然后面试官评价是我各方面都回答的蛮好的,但是就是没下文了
说句实话吧,面得我很难受,我当天还面了别家,一对比我就觉得转转的这次面试不是很够专业考查得不够全面,特别是最后一个问题,我反问他“你能给我一点学前端的建议吗”,正常面试官是会针对我的回答然后梳理好告诉我加强哪方面的学习(以此来套出来我哪个问题没回答好或者哪里做得不够好),他直接反问我“你平时怎么学的”,然后我有点尴尬,我就说“我平时()巴拉巴拉)怎么学”,他就说“嗯嗯,就这样学就可以了,然后不懂的加深学一下,不用全都学”,我“??????”怎么听君一席话如听一席话的
我咧了个豆,我本人,最讨厌别人用问句回答问句!!!!!遇到喜欢用问句回答问句的mt真的会很心累的,一点都不直接,亲身经历。
这就是所谓的磁场不合吧,眼缘不好,当天晚上的另一个面试就跟别人聊得很顺利很舒服
答案参考
简单的回答参考一下
- CSS垂直居中:父容器设置 display: flex; align-items: center; justify-content: center; 或子元素 position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);。
- Flex布局:弹性布局,通过 display: flex 开启,常用属性:flex-direction(方向)、justify-content(主轴对齐)、align-items(交叉轴对齐)、flex-wrap(换行)。
- Transition属性:4个:property(过渡属性)、duration(持续时间)、timing-function(速度曲线)、delay(延迟)。
- Animation属性:8个:name、duration、timing-function、delay、iteration-count、direction、fill-mode、play-state。
- JS切割字符串:3种常用方式:split()、substring(start, end)、slice(start, end)(支持负数)。
- React实现KeepAlive:使用 react-activation 库或手动封装高阶组件,通过 display: none 缓存DOM,配合React状态管理。
- 前端异常监控:收集错误(window.onerror、Promise异常)、分类(JS错误、资源加载)、上报(API或日志服务)、分析(可视化平台)、告警(邮件/短信)。
- 用户行为监控:埋点(手动/自动)、监听路由/点击/滚动、记录时间戳和动作类型、存储到日志系统、分析用户路径(如热力图)。
- 封装公共请求:基于Axios/Fetch,统一配置baseURL、拦截器(请求/响应)、错误处理、Loading管理、Token自动携带。
- 重构稳定性保障:单元测试/Jest、E2E测试、Code Review、灰度发布、监控报警、逐步替换旧代码。
- 灰度发布:按用户ID/设备/IP分流,通过Nginx配置或网关路由,逐步放量新版本,监控异常后回滚。
- 代码灰度:前端通过特性开关(Feature Flag),后端接口版本控制,动态配置开关(如通过接口返回权限)。
- 公共图片上传组件:支持拖拽/点击上传、校验格式大小、预览/裁剪(第三方库)、多图上传、进度条、统一封装上传API、回调处理。