前言
先说 bg , 小编是26届双非二本
的计算机科班出身,近期面试了快手
、网易(挂)
、cvte
、mobvista
、小鹅通
、凡岛
、软通动力
、美的集团
和三维家(挂)
等众多大中小厂,目前也是顺利拿到了快手的 offer , 因此想借此机会总结一下近期的面经以及个人的一些感悟等,希望能对各位朋友有所帮助,若对哪里有什么见解也欢迎在评论区发表您的高见,小编洗耳恭听...
快手
- 自我介绍
- 平时怎么学习前端
- 项目:
1. 详细说一下业务背景、遇到过什么问题以及怎么解决的
2. 你觉得作为实习生做这个压力大不大,是自己主动接的需求吗
3. 不同子应用之间切换是怎么实现的(路由激活,并结合快照机制缓存),路由怎么处理(基座应用配置相关)
4. 这个框架相对来说有什么优点以及原理如何实现的
5. qiankun里面的沙箱部分详细说一下
6. 流水线你是这么理解并配置的,为什么这个功能点会分配给你做呢
// 微前端这个项目拷打了很久,人都麻了,大部分问题后面想不起来了,主要是涉及到原理层面的东西
// 以及方案对比、调研的过程等等
// 因为当初确实花的时间比较多,最后面试官说这块确实看得出来是用心做了才肯放过我
// 面试快结束的时候面试官说组内也有涉及微前端,也难怪会问很深,特别是qiankun框架的原理实现
- java和js区别、说说你对单线程的理解,为什么需要有异步任务
- Vue2和Vue3你使用起来的直观感受是什么
- 详细讲讲Vue原理是什么,详细说一下(提了响应式、模板编译、组件化、虚拟dom、路由和状态管理等核心模块及其原理)
- 有没有写过Vue2项目
- 拷打对TS的了解程度(type、interface和枚举等)
- 问了下掘金博客上的东西以及一些奖项(比如比赛和软著相关,基本是与代码相关的)
- 代码输出、手撕以及算法:
1. 输出题:
for(var i= 0;i< 3; i++){
setTimeout(function(){
console.log('timeout' + i);
})
}
new Promise(function(resolve){
console.log('promise' +i);
for(vari= 0;i< 1000;i++){
i== 99 &&resolve();
}
console.log('promise'+ i});
}).then(function() {
console.log('then' + i);
})
console.log('global'+ i);
2. 手写debounce(用TS写)、如果想要第一次进来就执行一下而不是想等定时器计时完再执行
怎么做(当时利用闭包的特性利用一个标志位延长变量生命周期实现的);还有就是 throttle,
我快速写了时间戳和定时器版本,被追问了两种各自的局限性,还有就是写出来两者的结合版(当时
有亿点卡住了,在提示下终于写出来了...)
3. 算法题:括号匹配(要求使用TS),leetcode 的简单题,利用 map 结合一个数组作为栈即可
-
反问:
-
业务以及技术栈,如果有幸加入的话要做哪些
-
学习建议
- 多实践,像你现在一样早点出来实习、写博客是比较不错的亮点
- 加入一些开源社区,向一些牛人靠拢
- 养成看源码的习惯,学习代码的书写思想
-
-
最后问了下我近期的学习规划、offer情况、最快入职时间以及实习时长等,基本是在聊天了
个人整体的感受就是快手这边比较注重手写代码的实践能力,算法和手撕部分提了不少的修改点让我去实现, 还好不会的点在提示下也写出来了
网易
- 拷打项目
`移动端项目`:
1. postcss相关(postcss-px-to-viewport 插件将 px 单位自动转换为 vw 单位如何做到的?
分析了postcss的三个阶段,插件主要是在对ast进行traverse阶段发挥作用,对中间产物的
相关节点进行调整,以此扩展postcss的功能),后面追问了一下响应式布局相关的实现方案
以及在不同设备上有没有遇到布局问题?(比如在平板上使用等等)
2. 埋点相关(公司内部没有埋点平台吗?都是借助的sdk实现的?(公司内部包装了一层,没有
完全依赖第三方平台实现)有没有遇到什么问题?(回答了之前手动埋点业务相关的问题,使
用全局路由守卫那里))
3. 为什么想要封装自定义弹窗组件?以及样式怎么兼容的?如果我不要传入样式去手动实现,
比如向element定制主题色一样,识别项目主题色进行兼容怎么做?又一键换肤后还要怎么做
(除了你刚刚回答的Sass之外,有没有分析过element并且参考怎么实现的)
`微前端项目相关`: (感觉大部分是在问我八股多一点)
1. 为什么采用qiankun?(技术选型&&调研)
2. Vue2和Vue3的的features?生命周期?双向数据绑定原理?
3. 你提到了状态管理,那么如果有一个props传递过来要怎么修改,子组件如果有数据修改会调用那些API?
父子组件的执行顺序是什么(我提了父子组件生命周期的更新顺序)?如果还有其他组件watch这个组件
的数据呢(不仅仅是父子组件使用了watch),执行顺序?
4. 有一个字符串函数,我要怎么调用?(没答出来(我说反序列化似乎行不通,这个不是一个严格的json格式,
可能字符串的原型上有个别属性可以实现,但是我没想起来)...面试官说一种是eval,说另一种的时候面
试官网卡了,我没听清呜呜呜)
5. TS相关:如何定义类型?(回答了interface和type,被追问枚举类型了)
6. es6相关:有哪些新features?箭头函数和普通函数的区别?class经过编译之后会变成什么?promise有哪些静态方法
- 手写相关:
1. LRU
2. 链表反转
3. 还问我一些算法相关的,考察数据结构与算法的理解(比如追问了哈希链表、红黑树和平衡树等等)
-
反问:
- 负责模块(内部系统相关,框架Vue为主,ui使用element和内部封装的组件库)
- 学习建议(
多往原理上深挖一下
(Vue和TS(比如你刚刚TS中回答的比较不好的枚举类型还有就是比如class编译后的产物是什么样子的)),第二点就是业务层面
:有想法并且去实现了,但是没有足够的去调研和分析(比如你封装的插件,在动态样式的考虑的时候,没有考虑到使用element里面的主题色一键换肤的功能实现,可以去看看element源码的实现,然后自己再封装一下,实现一个足够抽象和通用的插件)
面试体验不错,但是挂了,很多东西底层原理问的有点深,没答出来,即使一些基本的问题能理解和算法题写出来了
软通动力(全栈实习生岗位)
-
自我介绍
-
近期做的项目难点,怎么解决的
- 介绍了qiankun项目重构的难点:巨石应用+旧项目的规范和现在组内的不符+有新的需求要加入(新增了门店端和供应商端,因为原本是采用的RBAC的权限访问控制方案,所以这两个端与之前的商家端等其角色互不影响,这也是后面采用微前端的一个重要前提)
- 上网收集资料后发现采用微前端方案比较切合,此时的难点就转为微前端的技术选型与调研,常见的微前端方案比如iframe、无界、webpack 5的模块联邦、Micro App以及qiankun等,qiankun基于single-spa封装的,配置比较友好,以及基于proxy实现的js沙箱机制,对每个子应用的window全局对象进行拦截操作,实现各个子应用之间的全局状态隔离,以及基于shadow dom实现的严格样式隔离方案和基于scoped css实现的样式隔离方案来防止应用之间的样式污染问题),因此相比于其他方案有着众多的优势,而且qiankun是当前的热门方案,社区比较活跃,综合来说最终采用了qiankun的方案
-
状态管理(Vue和react都说一下)
-
useMemo和useCallback的区别以及使用场景
-
对国际化有没有了解过
-
watchEffect 和 watch区别
-
介绍一下Nest.js
美的集团
-
自我介绍
-
用Vue多一点还是react多一点(回答了vue,后面基本在问vue)
-
v-model的原理
-
数据模型的改变是如何驱动视图view的改变的
-
vue2、vue3的响应式区别
-
vue2中对数组根据索引赋值可以监听到吗(我记得vue重写了数组的方法,通过那些方法可以,但是这个问题当时回答的是不可以,要手动调用$set -->✅)
-
v-for的key作用
-
项目中的重构需求是怎么做的
-
你提到了乾坤中的样式隔离,那你知道vue中scoped的原理是什么吗 Vue 使用 特殊的属性选择器(data-*) 来实现
scoped
,避免全局污染。- Vue 会给当前组件的根元素动态添加唯一的
data-v-xxxx
属性。 - 然后 自动修改 CSS 选择器,使其仅作用于带有这个
data-v-xxxx
的元素
- Vue 会给当前组件的根元素动态添加唯一的
-
组件通信
-
vuex的mutation和action区别
-
在body写了一个无限循环,在页面上会呈现什么结果
-
反问 1. 技术栈(vue、react、微前端都有) 2. 学习建议
- 尝试多接触点业务,提及了我无限循环那个问题没回答好(我说的是页面有可能白屏,因为同步代码 会一直阻塞js主线程,影响页面的渲染,最终爆栈后页面应该会崩溃)
- 对前沿技术要积极去了解,比如AI, 可以学习使用,为我们的开发赋能
凡岛
- 自我介绍
- 实习项目业务负责的情况(这里的回答很大程度上决定了下面的提问,比如我qiankun中使用了Vue2,Vue3,所以下面询问两者区别等等)
- Vue2、Vue3区别(代码风格、响应式、TS支持、生命周期等)
- qiankun技术选型、调研(why qiankun + monorepo, 使用的必要性、痛点难点?)
- Vue3结合h5开发的小程序项目介绍,为什么不使用混合开发模式(如rn,uniapp等)?(公司技术栈限制、本项目基本没有调用小程序的任何内置的能力,由中国移动那边的链接跳转即可,我们只需要编写常规业务,所以没有使用的必要性)
三维家
- ts和js的理解
- const push一个元素?如果我就是想实现这个而不是重新赋值这么做
- static
- 如何实现类的覆写、面向对象语言的三大特点是什么
- es6新特性
- canvas
- 实习中遇到的问题并且有什么感受(提了一下单点登录和敏捷开发过程中的代码分支误区)
- 对数据库有没有了解过、为什么离职
- 反问: 1.学习建议:知识的全面性(比如学了three之后应该了解过canvas,明白两者之间的关系) 2.希望实习生具备的资质或者什么对面试官比较有吸引力:对知识点有理解,可以不懂,但不能问什么都不懂;技术栈对口,找你是来干活的;学习能力,指导之后可以完成任务,指导多次没有效果会显得很掉价
总结
面试完之后反馈最快的是快手了,面试体验也非常好,主要是技术栈比较切合吧,才面试完不到半小时hr就打电话沟通offer了,另外剩下一些其他公司的就不总结了,问的其实差不多,很少有像大厂一样会涉及到原理层面,似乎偏向八股文了,没多大记录的价值,望谅解(其实是小编太懒了...)
感悟
在实习和加入开源社区的过程中,我深刻体会到积极与他人交流、请教的重要性。通过与前辈互动,我不仅拓宽了视野,还获得了宝贵的实习机会。正是这些经历,使我最终成功拿到快手的offer。
在开源项目中,主动请教他人、参与讨论,不仅能加深对技术的理解,还能建立起专业的人脉网络。这些人脉在职业发展中起到了关键作用。因此,我鼓励大家不要只沉浸在自己的世界中,多与社区中的大佬们接触,积极参与讨论和协作。通过这样的方式,我们不仅能提升自身的技术水平,还能为未来的职业发展铺平道路。
此外,参与开源社区也是积累实践经验的绝佳途径。在实际项目中,我们可以将理论知识应用于实践,锻炼解决问题的能力。同时,开源项目的多样性和开放性,使我们有机会接触到不同的技术领域,拓宽我们的知识面。通过持续的学习和实践,我们能够不断提升自己的竞争力,为未来的职业生涯打下坚实的基础。
总之,积极参与开源社区,主动请教和学习,是提升自我、拓展人脉、获取实习和工作机会的有效途径。希望大家都能走出舒适区,勇敢迈出与他人交流的第一步,找到属于自己的位置。
致谢
近期压力确实是比较大的,寒假期间在系统性重学react以及工程化知识,每天都在坚持写日报记录今天学习了什么、有什么思考以及明天的计划等等,开学前投简历没什么大厂回复等,让我倍感压力,在向大佬学习的同时也在不断调整自己的节奏,最终才拿到快手offer, 以下篇幅主要是讲讲对这半年来陪伴以及指导我的朋友们说的一些致谢相关的话语:
实习篇:
从去年7月份开始在卓望公司实习,非常感谢导师以及几十位好哥哥同事们的教导,在这个过程中写了不少的业务,大部分时候其实我觉得是比较吃力的,写的差不多的时候会主动和导师要新的需求,因此导师经常在产品、测试、后端以及运营等等同事偷偷夸我,让我认识了不少同事,同事们对我说话非常客气,有一些公司福利的时候会叫我去参与,请我喝奶茶等等,虽然有压力,但是也有动力吧,这个过程进步真的大哈哈;不过我也难免遇到问题,我通常会带着电脑到同事面前请教,同事们都很快反馈我的问题,大部分时候都乐意帮我写出大体思路以及给我讲述原理,还有就是公司内部的开发流程等等,以及离职的时候导师给我讲人生规划、部分同事下午饭都没吃,从下午4点多给我给我讲一些复杂的业务场景的实现思路并把相关的开发文档以及项目代码给我回来研究,讲述完的时候大概都快晚上八点了,特别感谢同事们的教导,回想起来,总会有一股暖流直击心灵,累确实是累,但是也真的收获颇丰,总结来说的话就是故余虽愚,卒获有所闻
开源社区篇:
在开源社区认识了好多大佬,并且给我内推了快手、字节等(字节的相关面试官还加了我的微信,打电话教我怎么准备,让我适当可以做下减法,说等我准备好了随时投简历给他,再给我安排面试,真的特别贴心,我也真的很感动),那天是早上十点内推的简历,十点半hr打电话给我约面,约了下午四点的面试,拷打完之后不到半小时快手hr就打电话说我面试通过了!!!,既激动又紧张,在此特别感谢 tzx 和 嘎子,特别是 tzx 对我的工程化思想、思考问题的维度以及架构思维的作用是非常大的,简直是我的神!!!下面是两位大佬的传送门:
偶像:tzx
偶像:嘎子
对未来的展望
没想到自己也可以摸到大厂的门槛,0-1的过程难免会些许痛苦,但是这一切都是值得的,至于我能不能从1走到100,还得看我自己,在此想对自己说:何时葡萄成熟? 你要等候等候再等候...
🚀 愿每位开发者都能在技术的星辰大海中找到自己的航道、同时祝各位看到此博客的朋友们事事顺心!!!