阿里、网易、滴滴、字节跳动共十四次前端面试碰到的问题，最终拿到了字节跳动offer

川长思鸟来 2022-12-30 14:59 26阅读 0赞

![5a75fd66ea76a9565f5c429f60e58de4.png][]

前一段时间一直在不断地面试，准备了三四个月，刷了无数的面试题，只有字节跳动进入了HR面试环节，最终顺利拿到了offer。

阿里面试了三个部门，都是在二面挂的，网易和滴滴也是各两轮技术面试，字节跳动三轮技术面加一轮HR面，加一起就是十四次面试经历。在此回忆总结一下，既是给社区朋友的一个参考，反馈社区，更是给自己一个好好的总结。

## HTML ##

*  HTML5新增了哪些内容或API，使用过哪些
 *  input和textarea的区别
 *  用一个div模拟textarea的实现
 *  浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢？
 *  Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?
 *  HTML与XHTML——二者有什么区别

## CSS ##

*  左右布局：左边定宽、右边自适应，不少于3种方法
 *  BFC、IFC
 *  对栅格的理解
 *  （水平）居中有哪些实现方式
 *  1像素边框问题
 *  CSS优化：
 *  CSS开启GPU加速
 *  开启GPU硬件加速可能触发的问题：
 *  CSS选择器有哪些？哪些属性可以继承？
 *  CSS优先级算法如何计算？
 *  如何居中div？如何居中一个浮动元素？如何让绝对定位的div居中？
 *  display有哪些值？说明他们的作用?

## JavaScript ##

*  图片懒加载
 *  实现页面加载进度条

![2873d88020674f308a15ffd923698393.png][]

*  事件委托
 *  实现extend函数
 *  为什么会有跨域的问题以及解决方式
 *  jsonp原理、postMessage原理
 *  实现拖拽功能，比如把5个兄弟节点中的最后一个节点拖拽到节点1和节点2之间
 *  动画：setTimeout何时执行，requestAnimationFrame的优点
 *  手写parseInt的实现：要求简单一些，把字符串型的数字转化为真正的数字即可，但不能使用JS原生的字符串转数字的API，比如Number()
 *  编写分页器组件的时候，为了减少服务端查询次数，点击“下一页”怎样能确保还有数据可以加载（请求数据不会为空）？
 *  ES6新增了哪些特性，使用过哪些，也有当场看代码说输出结果的
 *  JS模块化的实践
 *  require.js的实现原理（如果使用过webpack，进一步会问，两者打包的异同及优缺点）
 *  promise的实现原理，进一步会问async、await是否使用过
 *  实现gulp的功能
 *  使用前端框架（angular/vue/react）带来哪些好处，相对于使用jQuery
 *  vue双向数据绑定的实现
 *  单页应用，如何实现其路由功能

## 性能优化 ##

*  项目中使用过哪些优化方法
 *  输入一个URL，Enter之后发生了什么
 *  （承上）页面的渲染过程
 *  优化中会提到缓存的问题，问：静态资源或者接口等如何做缓存优化
 *  页面DOM节点太多，会出现什么问题？如何优化？

## 项目经历 ##

这些大公司招聘都是高级工程师起步，所以对简历上的项目会刨根问底。很多很多问题都是由项目中拓展开的，像优化相关的东西，还有前面提到的require.js、promise、gulp，项目中用到了某项技术，高级工程师的要求是：不仅会用，更要知道其原理。对自己的提醒：项目中用到的技术，不能说完全掌握其原理吧，但大致的实现还是有必要了解一下的。

*  介绍一下你做的这个项目，进一步细问：整个项目有哪些模块，你主要负责哪些
 *  你在项目中的角色
 *  你在项目中做的最出彩的一个地方
 *  碰到过什么样的困难，怎么解决的
 *  （如果你是这个项目的负责人），任务怎么分配的，有没有关注过团队成员的成长问题
 *  前端安全问题：CSRF和XSS

## 其他 ##

*  为什么选择做前端（我靠，我都快转前端两年了，还在问这个问题啊…）
 *  你希望进入一个什么样的团队
 *  你有什么问题想问我（面试官）的吗？
 *  选择公司的时候会看重哪些方面？

前前后后有两个月时间，暂时只回忆起这么多了，如果还有其他的，后期我会补上。

webpack其实也是必问的，由于我说还没使用过webpack，只是了解，写过demo，面试官就没问太深。如果你的简历中有提到webpack，请提前准备好，比如webpack打包原理、如何写webpack插件等。

面试阿里云那个岗位的时候，有要求算法和数据结构，有能力者多多准备吧。

阿里、字节的面试几乎都是围绕项目展开的，所以提醒自己搬砖的时候多想想、多看看，多站在一个高度去看整个项目：用到什么技术，技术实现原理是什么，项目框架怎么搭建的，采取安全措施了吗…

## 后记 ##

总结一下这三次面试下来我的经验是：

1.  一定不要死记硬背，要理解原理，否则面试官一深入就会露馅！
2.  代码能力一定要注重，尤其是很多原理性的代码（之前两次让我写过Node中间件，Promise.all，双向绑定原理，被虐的怀疑人生）！
3.  尽量从面试官的问题中表现自己知识的深度与广度，让面试官发现你的闪光点！
4.  多刷面经！

**我把所有遇到的面试题都做了一个整理，并且阅读了很多大牛的博客之后写了解析，免费分享给大家，算是一个感恩回馈吧，有需要的朋友[【点击我】][Link 1]免费获取。祝大家早日拿到自己心怡的工作！**

**篇幅有限，仅展示部分内容**

![ac0b1c2376da47d727e0dc8a77e76478.png][]

![b871b45fb2e6d5442144c863cbcff965.png][]

![f5c18f4b2878302f1f53a8c393e7eb0d.png][]

[5a75fd66ea76a9565f5c429f60e58de4.png]: /images/20221120/cbe4d4df64144d729c63f85546d4121f.png
[2873d88020674f308a15ffd923698393.png]: https://img-blog.csdnimg.cn/img_convert/2873d88020674f308a15ffd923698393.png
[Link 1]: https://links.jianshu.com/go?to=https%3A%2F%2Fjq.qq.com%2F%3F_wv%3D1027%26k%3DZEKfV3Ax
[ac0b1c2376da47d727e0dc8a77e76478.png]: https://img-blog.csdnimg.cn/img_convert/ac0b1c2376da47d727e0dc8a77e76478.png
[b871b45fb2e6d5442144c863cbcff965.png]: https://img-blog.csdnimg.cn/img_convert/b871b45fb2e6d5442144c863cbcff965.png
[f5c18f4b2878302f1f53a8c393e7eb0d.png]: https://img-blog.csdnimg.cn/img_convert/f5c18f4b2878302f1f53a8c393e7eb0d.png