字节跳动 四轮面试 --全过程记录

大概春节之后吧，就有字节跳动的hr联系到我，看到我的信息是明年毕业了，要不要试一下实习面试，我就想着反正不亏，就试一下吧哈哈。

面试前

• 整理一下自已目前为止所做的项目，做一下项目的总结，找到项目中的亮点和难点，做出一份归纳，以便在面试过程中可以和面试官聊一下。
• 算法题刷题，这个不用多说了吧，找工作找实习都需要刷一下的，前端的话刷到leetcode中等难度就可以了，感兴趣也可以做一下较难的题。我大概刷了50道leetcode吧，各种类型都做一下那样。
• 前端面试题，强烈建议刷牛客上的前端系列面试题，上面基本上能够涵盖百分之六十的面试题，热度高的那些题刷个二十题就差不多了。
• 锻炼一下说话聊天的能力，可以练习一下讲解自已做的项目，说一下亮点和难点，确保表达清晰，逻辑清晰，语言流畅。

然后就是，面试是开摄像头的，面试之前整理一下仪容，留个好印象也挺重要的~~

一面

首先是自我介绍，一面的自我介绍应该详细一点，毕竟是第一次介绍自已。

question one

在自我介绍的时候聊到了自已做过的项目，面试官就针对我做过的项目深入地问下去，在做小程序时我有对微信的几个基本api进行了二次封装，分别如下：

• 对于全局数据共享，进行简单的消息中心封装
• 对于全局路由管理，基于Map进行路由判断封装
• 对于云函数调用，基于promise链式，进行拦截器封装

其实上面的三个对于基本api的封装，是在做创维的项目时有一定的思考之后进行的，熟悉前端主流框架vue的同学应该不会陌生，分别对应三个主流开发工具包：vuex，vue-router，axios

只是小程序由于其天然js桥的环境隔离，并不能上述成熟的工具，我就尝试着自已进行简单的封装了；如果对上述三个工具包的源码有一定的研究的话，在小程序端把基本功能封装出来是不难的，如果感兴趣的话，可以看我的博客：https://blog.csdn.net/weixin_43783814/article/details/113358070

跟面试官讲解了一轮之后，可能讲解的不是很清楚吧，然后我就请求了共享屏幕，直接打开代码给面试官看，让面试官一边看代码一边听我的讲解了。

这一部分讲完，面试就已经开始了大约半个小时了，这也是一面的主要部分了~

question two

问：既然聊到了小程序，可以聊一下小程序生态吗？
答：首先小程序是为了解决跨端应用问题的，原理是js桥，进行底层的隔离，再把对应的钩子暴漏出去形成小程序开发过程中使用的API。

ps：这里对于js桥的原理，大家去搜索一下了解一下吧，上述回答是简易版，真正面试肯定要聊多一点的。

问：小程序开发中，怎么做全局环境和页面独立环境的隔离？
答：首先，根据js桥的隔离，小程序也是类似单页面应用的架构，根据app.json中的配置项为主页面进行基础配置而已，比如说导航栏其实是js桥在在节点树末端加入官方写好的组件并且通过display:fixed完成的。全局入口环境是app.js，js桥在背后完成了页面的栈式管理，所以只要在app.js中绑定方法或者类就可以完成全局环境的隔离了。

ps：对于小程序底层，可以参考小程序官方文档和一些博客讲解，这里问的比较深了，我并没有答得很好，希望大家如果遇到这个问题，可以答得更好

问：小程序开发中，怎么取到特定的页面或组件
答：小程序页面是栈式管理的，有特定的api可以取到这个栈；如果要取到特定的组件，需要在引入组件时绑定id，然后可以通过selectComponent()取到对组件的引用

question 3

问：你刚才说有做过博客网站的项目，有什么印象深刻的地方吗？
答：前端方面主要都是写页面，写逻辑，没有太多亮点；后端方面也是增删改查为主，印象深刻的就是对于评论模块的处理。

问：评论模块怎么处理的？
答：思考过后，采用两张表解决这个问题，一张表存储根评论，与博客文章多对一相关；一张表存储根评论下的子评论或者回复，需要记录是属于回复根评论的或者是回复子评论的

问：有没有考虑过一张表就能解决呢？
答：如果使用一张表的话，就采用类似于树的结构，需要记录父评论的id，如果是根评论的话，父评论id就是空了

问：既然这样，写一个函数来处理一下这个结构吧，转成前端需要的结构

1-1

ps：这个问题挺经典的，不给出代码了，大家自已试一下吧

q&a

反问阶段，由于当时我网络出现问题了，就跳过结束了~~

二面

一样的，先是自我介绍，这次自我介绍就可以简短一点了，上一轮的面试官其实已经记录了挺多信息的了，不用说太多了

question 1

问：能不能聊一下，一个html文件中，通常写在哪？为什么？
答：如果单个页面，写在html代码之后，其实通过webpack等构建工具构建出来的代码也是写在html代码后面的，这是为了让浏览器渲染效率提高所做的。因为浏览器在把我们写的代码转换成我们看到的页面是先维护两棵树的，一棵树是元素节点信息的树，一棵是节点样式信息的树，在两棵树构建完成后才会进行树的合并，生成一棵包含样式，属性等各种信息的节点树，最后才根据这棵节点信息树把页面画出来。而因为js脚本语言是可能会操作元素节点信息的树的，所以浏览器在碰到js脚本时会停下树的构建而先把js代码执行完，这样会造成页面性能的变差，所以尽量把js脚本放到html代码的后面，或者使用async，defer异步加载脚本。

ps：浏览器原理前端的同学还是要了解一下的，搜一下资料看一下即可

问：既然说到渲染的过程，做道题吧，把这个描述对象渲染成节点树

2-1

ps：经典前端面试题，问题不大

question 2

问：

2-2

ps：也是经典面试题吧，通过不同浏览器支持的特殊js-api可以检测；css里也有wekit这样的标准可以检测，大家搜一下就知道了。

question 3

问：

2-3

ps：依然是经典面试题，自测一下吧

question 4

问：

2-4

js基础，后面追问了new Number(1)==new Number(1)

question 5

问：

2-5

不多说了，js基础；

因为用到了Array.from()，追问：这个函数第二个参数是什么，第一个参数是不是传入任何变量都可以？

ps：Array.from()传入的第一个参数是可枚举变量，可选的第二个参数是枚举函数

question 6

问：下面的代码会渲染出container实际高度是多高？怎么解决child不占高度的问题？

2-6

ps：css基础，大家应该都懂~~

q&a

反问：怎么实现全球语言的应用适配

二面总结

二面聊的就比较少了，以做题为主，其实做的题不止上面这些的，还有几题因为是面试官口头述说的，我没能截下图，过了也挺久了，记不起来了，但总体还是基础为主，难度没有太高

三面

三面的面试官看起来感觉是个大佬~~

question 1

问：怎么学习前端的？什么契机开始学习？
ps：这种问题可以事先准备好答案了，回答时可以自信一点

问：看书的话看些什么书来学习前端？如果让你推荐一些书给别人学习，你会推荐哪些？为什么？

问：ES6中哪些特性或者方法你觉得很好？平常开发时用哪些比较多？

问：(前面聊到了Object.assign()是浅拷贝) 能说一下深拷贝和浅拷贝吗？
ps：对于这个问题网上有很多答案，但我个人觉得都不太准确。如果了解计算机基础的话，应该能明白无论什么语言，数组和对象变量其实都是一个指针，指向具体数组或对象数据存储的位置，而arr[i]中的i其实表示的是指针指向的位置向后移动多少个单位取数据。所以浅拷贝本质上拷贝的是指针，而深拷贝是把所有数据拷贝一份的意思~~

问：那就实现一下深拷贝吧

3-1

ps：经典面试题，问题不大

question 2

问：聊一下数据库？如何防止死锁？如何解决死锁？
ps：计算机基础，可事先组织好语言，当八股文背吧~~

问：聊一下计算机网络？
ps：自顶向下聊一下即可

问：tcp是如何确保双方通信无误的？
ps：传输层的算法聊一下即可

问：三次握手四次握手的过程聊一下？
ps：必背的内容，不多说了~

问：url的各段分别是什么作用？
ps：基础问题，分段讲一下url就行。对于#后面的部分我扩展地聊了一下用于前端路由的实现，然后再聊了一下前端路由器和路由组件的实现原理(面试官对我的扩展讲述挺满意的)
在回答问题中如果遇上自已擅长的东西可以扩展将一下，能给面试官留下好印象~~

问：写个函数，解析query

3-2

ps：牛客上有原题，不多说了

q&a

我继续问了二面的问题：如何实现应用在多语言环境下的切换？

四面

刚刚面完四面，四面有点翻车了，可能会导致凉了~~

question 1

问：前面的几轮面试感受如何？
答：面试官风格不同，有些聊天比较多，有些写题比较多~~

问：那你喜欢聊天还是写题？
答：当然是喜欢聊天啊哈哈~

问：看到前面面试官有记录下你聊你之前写过的项目，可不可以聊一下前面没有讲过的东西呢？
答：个人觉得有亮点的都聊过了，还有一些简单的项目也没有聊的必要了。还有一个是跟老师做的项目，基于python qt 做的桌面应用

ps：万恶的开始，聊了python qt，就被抓着问底层了，后面直接裂开~~

问：

4-1

ps：答得不好，没准备这方面的东西

question 2

问：在用qt开发时，和前端开发有什么不同？有什么相同？
ps：不给出答案了，应该没多少同学知道qt吧~~

问：python qt 的事件机制与前端的事件机制分别是怎么样？
ps：python qt 的我就不给出答案了，前端的事件机制就是指冒泡和捕获那一套

问：(聊到html本质上只是一段字符串，其实单纯用js也可以写出页面) 实现一下描述对象转xml吧

4-2

ps：其实和前面二面一道题几乎一样

question 3

问：聊一下js和python的基础数据类型？

问：你觉得python和js有什么不一样？
ps：js是解释型语言，python是编译型语言，要了解到js其实和html没什么区别，本质上是一段字符串~

问：语言特性上有什么不一样的？
ps：我聊了一下，js其实是没有类的概念的，js的类其实是通过对象和原型链构造出来的~

问：还有吗？
ps：暂时想不到了(难受)

问：python和js的垃圾回收机制分别时怎么样？
ps：python的我就不聊了，js的垃圾回收机制要分为浏览器端和node端的，这里跟大家聊一下吧：

/** 内存控制
 *  在V8引擎中，主要将内存分为新生代和老生代两代，新生代中的对象为存活时间较短的对象，老生带中为存活时间较长的对象
 * 
 *  在分代的基础上，新生代中的对象主要通过Cheney算法进行垃圾回收
 *  Cheney算法是一种采用复制的方式实现的垃圾回收算法，将内存分为From空间和To空间，分配对象时先在From空间进行分配
 *  当开始进行垃圾回收时，会检查From空间中存活的对象，这些存活的对象将被复制到To空间中，而非存活空间占用的空间将被释放，
 *  完成复制之后，From空间和To空间的角色发生对换
 * 
 *  而当一个对象经过多次复制依然存活时，它会被认为是生命周期较长的对象，随后会被移动到老生带中，这个过程称为晋升
 * 
 *  在分代的基础上，老生带中的对象通过Mark-Compact方法管理，标志整理的意思
 *  在标记阶段遍历堆中所有的对象，并标记活着的对象，
 *  在整理阶段，先清除没有标记的对象，再将活着的对象往一端移动，防止出现内存空间不连续的问题
 */

这个问题很难简短说清楚，大家可以读一下<>这本书，书中有详细的说明

question 4

问：

4-3

ps：情商问题，可以先组织好语言

问：开个脑洞

4-4

ps：没有统一答案，开脑洞聊一下

q&a

我继续追问了多语言适配的问题

ps：其实我每一轮问这个问题都是不断深入的问的，并不是一样的问题，这里不展开说了~

总结

不知道能不能通过技术面试，四轮面下来，感觉面试官还是很希望面试者能够多聊一下自已做过的东西，有什么觉得自已做得比较好的地方的。尽量多准备一些可以自已聊的东西，准备多一些项目去聊(我三个项目，到后面都不够聊了)，但是不要去抄别人的东西，一定要是自已真正懂的，不然被面试官抓住漏洞问你，你又没有深入了解和思考的话就凉了~~

希望大家春招顺利！！！