首页 > 21届秋招字节跳动抖音-前端面经(已收到意向书)
头像
-Seven-
编辑于 2020-10-26 14:02
+ 关注

21届秋招字节跳动抖音-前端面经(已收到意向书) 内部员工回复

已拿到意向书,记录一下这次第四战终于不是终面挂的面试~,由于当时没有及时做记录,以下是我能想起来的部分。

10-09一面:
1. 上来先介绍项目,说到在工作室做的项目时,提到了“根据项目路径自动生成路由树,再将这棵路由树层序遍历出一个react-router的组件序列”,面试官问我使用的require.context的原理是什么,因为没有做过这点准备,然后翻车了...面试官后来说对于这些方案使用到的api,应该有一个怎么原生实现的想法。
2. 说到react框架层面,在生命周期函数中做了一些渲染优化,避免不必要的render。扯到了fiber,就说一下react fiber的实现(关于fiber的时钟的实现还能扯到requestIdleCallback + requestAnimationFrame),以及优点,为什么需要fiber
3. 介绍项目说到在浏览器渲染上减少重绘和重排的一些操作,提到了使用opacity和z-index新建图层等。还提到了will-change,面试官说这个他不知道。
4. 然后是一道css题目:需要写一个弹框modal,怎么让他在视口居中。如果要动态添加浮现的动画,应该怎么写。多写一个类用动画属性或者使用transition,动态添加就好。
5. 移动端的适配应该怎么做?rem等比例缩放布局,多倍屏媒体查询解决0.5px问题。rem布局并不完美,定制的适应性布局可以rem+flex+px。
6. TCP挥手为什么客户端需要等待2MSL才进入closed状态?
7. 一道任务队列题目:
document.addEventListener('click', function() {
console.log(1)
new Promise((resolve) => resolve()).then(() => {console.log(2)})
})
document.addEventListener('click', function() {
console.log(3)
new Promise((resolve) => resolve()).then(() => {console.log(4)})
})
console.log(5)
需要注意的是浏览器I/O事件属于宏任务
8. 算法题,二叉树的路径和

10-10二面:
1. 上来介绍项目,说到在工作室做的项目时,说到了项目中为了达到“保存多页面状态”的目的而使用了redux做状态中心化管理。面试官问除了redux还有哪些状态管理工具,答了mbox,mbox + react hooks能够更加快捷地开发。其实还能再说一个recoli的。面试官接着问有没有对redux做一些改造,比如给每个action做一个记录,达到“前端日志”的效果,可以监测记录用户的每个动作,在某些时机比如卡了的时候可以做回退。面对面试官这样发问,我搬出了朋友在某厂实习遇到的类型相似的业务情况,比如用户端有个可以写很多内容的富文本,当他点击上传,上传给服务端的时候,服务端收到了,紧接着服务端需要发布到对应的服务器上。在这个过程中有一次转发,像富文本这样大的数据在传输过程中传输出错的概率是不小的。就要求三方都保留一份副本,富文本数据发布时做一次比对。问题在于用户端的浏览器上只能选择indexDB去存储这个数据量的数据,尽管如此,保存一整个富文本的数据对于浏览器的一个页面进程来说仍然有点过分(indexDB限制了每个页面的数据存储大小)。这个情况下使用“记录用户的每一次操作”的“前端日志”方案就只需要更小的存储空间,又能存储下同样的信息量的数据。
2. 说到实习做的东西,我描述了“监听路由切换并上报数据的无埋点数据采集上报代码探针”,采集什么数据,通过什么api采集,如何监听路由切换。面试官指正说一般的无埋点应该指的是如何简化需要手动埋点的工作量,比如点击上报。
3. 继续说实习做的东西,由于实习的工作基本上就是写活动页面,面试官问没有做生成页面的方案吗,我说没有,浅谈了一下对于拖拽生成页面方案的设计流程,还有局限性。
4. 面试官问你是网络工程专业的吧,dns查询的过程是怎样的,缓存和查询说了一遍。http1.1和http2有什么区别,从优化点的角度描述了一遍。说http2的时候提了一下websocket,被问websocket的双向通信和http2的服务端推送有什么区别,后来去看了大概就是ws需要握手建立连接而且好像是没缓存的,而http2的推送是有缓存的,推送功能自然是不需要单独握手。http和https的区别,描述一遍ssl/tls(旧版本)握手。
5. 做了一道和一面差不多的任务队列题目。
6. 代码题
实现add(函数柯里化)
add(2,3,4)=9
add(2)(3,4)=9
add(2)(3)(4)=9
add(2,3)(4)=9
最终没有完全写出来,还差一个点没调试好。
7. 问了一下还有什么offer,是哪里人。
8. 为什么会选择前端,之后的职业规划/学习计划是?
9. 最后有什么想问的吗

10-15三面:
1. 上来问实习做了什么东西。依旧是答代码探针,在说到怎么选择上报时机的时候,提到页面卸载时发送请求的几种方式其中有navigator.sendBeacon,面试官问为什么sendBeacon可以无阻塞地发送请求,我有点懵..试探性地答了浏览器的进程线程组成,没说完面试官说不用说了..
2. 然后我提了一嘴前端性能监控,面试官追问前端性能指标,FCP TTI,看过一次但是没记牢翻车之。后来补了一番LCP FCP FMP SI等等
3. 算法题:linux路径简化
input : '/a/b/.././c/d'
output: '/c/d'
有点可惜,这个题也是一步之遥调试出来。。最后我说我描述一下思路吧,面试官说思路我看得懂。。
4. 应该算是场景题?像百度那种广告推荐系统应该怎么做,比如在京东看了一个商品,然后去CSDN看了一篇文章,在CSDN上就会有刚刚浏览过的商品的广告信息。这个如何实现,我说这个问题的本质是不是实现跨域的浏览器数据存储,面试官说不是,按照这个思路来是想不出来的。
5. 智力题
一共有25枚硬币,有十枚正面朝上,你可以翻转硬币,但是不能用手感知到硬币是否正面朝上。现在闭着眼睛将硬币分成两堆,问如何操作才能让两堆硬币正面朝上的个数相同。
没想出来
6. 为什么会选择前端
7. 最后有什么想问的吗

三面如上答得很糟糕,已经做好心理准备了,没想到面试结束一小时左右hr发消息来说面试通过了。字节面试阶段效率很高,三次都是面完一个小时左右出结果。于是就到了较为漫长的审批阶段。一直到10-23晚上,上完一天班的我想着应该怎么安排周末复习准备下一次的面试的时候,十点多收到hr的电话,心情真是大落大起~


更多模拟面试

全部评论

(7) 回帖
加载中...
话题 回帖

推荐话题

相关热帖

历年真题 真题热练榜 24小时
技术(软件)/信息技术类
查看全部

近期精华帖

热门推荐