字节跳动-2年前端社招两部门面经

前言

第一个部门在技术老大面中挂了，第二个部门目前HRBP面完了提交了资料在等后续结果。 秋梨膏给俺一份offer吧。
由于年前开始面的，中间间隔了一个春节所以大概只能复盘有印象的问题且不一定是按照顺序复盘。

部门1

一面

1. 自我介绍
2. let/var区别。
3. 实现一个 sum(1)(2)(3)(...n), 这里写出了大概思路但是没有完整写完，所以要求换一道.
4. 写一段匹配URL的正则，包括协议、域名、端口、path、hash、querystring
5. 对闭包的理解，以及列举闭包的用处。
6. 接5，列举闭包的作用的时候举例了 for ... setTimeout，于是要求用多种方式实现。

   for (var i = 0; i < 6; i++) {
   setTimeout(function() {
    console.log(i)
   })
   } // for ... setTimeout问题其实有蛮多知识点可以问，需要结合所学所用灵活变通。

7. 说说看什么是跨域，什么情况下会发生跨域，有哪几种方式可以解决跨域。（这里我主动说明了什么情况下会发options请求）
8. 从输入域名到页面展现之间发生了什么。（一直以来非常经典有非常多知识点的问题，需要指出的是大多数文章并没有提到与 dns-prefetch preload prefetch 相关的点。）
9. 接第八点提到了缓存策略，于是要求简单介绍一下浏览器缓存策略。
10. 说说看你了解哪些 http status code （似乎忘了说1xx ，从2xx 到 5xx全说了一遍）
11. 由于之前工作大量涉及表单且有开发类似uForm功能的库，所以对其***能聊了蛮久，但是并不能提供任何经验，所以不做详谈。

• 一面耗费大概一个小时十分钟时间，结束之后直接进入二面流程，连着面试。

二面

1. 自我介绍
2. 接一面11条又聊了一会儿
3. ES6基础语法考察
4. 一段有Promise和setTimeout的console，让写输出顺序 => Event Loop考察
5. 实现一个可以控制请求并发数的最高效的发送请求功能。 这里由于之前自己写的功能里遇到过，所以有查过解决方案, 完整实现可以参考 async-sema。
6. 算法题：寻找两个二叉树节点的第一个公共父节点。先说思路再写代码，写完之后问了我下复杂度
7. 对Node.js有多少了解（后来才发现简历中写了Node所以每次都会问）
8. CSS盒模型稍微问了点，不深，连BFC都没问

技术老大面

1.自我介绍
2. 接一面11条继续聊，问我其中一个点的优化方案，没答上来。（过了年之后顿悟了知道怎么优化了...）
3. 对于前端工程化的理解和实践，这里事前有所准备所以讲了比较多的点，从开始项目架构到开发中提升效率的细节到上线的整个过程都有介绍。（但硬伤确实是当前团队较小缺少Code Review等，这也是后面问老大对我的评价中得知的，应该也算是挂掉的其中一个点。）

    // 这个问题其实很宽泛，可以答的点很多，可以根据自己的经验和理解发挥。

4. React的key有什么作用。 介绍一下diff算法。（其实key还有一个dom复用的作用在很多的文章中都没有指出）
5. 实现第四问中的组件chilren diff中的得到patch数组方法，只需要返回插入、删除、更新的节点即可。（这里我们约定了可以直接使用isShallowEqual方法）

部门一面试总结

• 通过在技术老大面提问题中得知整体OK，但是缺少一个亮点。而且由于老大面中的第二个和第三个问题中我标出来的点的原因，所以最终这个部门面试到此结束了。
• 第一次进行字节的面试，全程都是视频面。面试体验相对其它厂来说非常棒。卡壳不要紧，可以向面试官进行求助的。面试官也会在你露出疑虑表情的时候提供一个帮助进行引导。 如果你确实不知道但是真的想知道的时候可以直接问面试官，面试官会给你一个答案（二面第4条中让我加深了对 Event Loop的理解）。

部门2

一面

1. 自我介绍
2. 之前的项目经历简述
3. this指向考察。 可以延伸到call apply bind

   var obj = {
   fnA() { console.log(this); },
   fnB: () => { console.log(this); },
   };
   obj.fnA() // this?
   obj.fnB() // this?
   const { fnA, fnB } = obj;
   fnA() // this?
   fnB() // this?

4. Promise.then里抛出的错误能否被try...catch捕获，为什么。

   try {
   Promise.resolve().then(() => throw new Error('Whoops.'))
   } catch (e) {
   console.log(e) //
   }

5. 接4，Promise了解吗，我就说手撸过，后面没细问。
6. React Hooks原理
7. 知道Fiber吗， 没细问。

二面

1. 自我介绍
2. 讲讲自己直接对Ant Design Form封装的具体实现，此处我直接贴了该框架的TS interface，然后整体讲解了一遍。（划掉，不具有参考价值）
3. React Fiber是个啥东西，为了解决啥，大概是怎么实现的？

   // 链表、一次Fiber循环所有节点访问两次、requestIdleCallback

4. 算法题：n级台阶，从0开始走起，一次可以走一步或者两步，那么走完n级台阶一共有多少种走法？先讲思路再写代码。

   // 卡了半天，一开始只考虑了 n-2，没考虑n-1
   function nSteps(n) {
   if (n <= 3) {
    return n;  
   }
   return nSteps(n - 2) + nSteps(n - 1);
   }

5. Babel是怎么将ES6转换为ES5的？

   // 这里面试时记忆出现了混乱，中间多答了一个`转换为 ES5 的 AST`。于是被追问傻了。

老大面

一直在聊之前项目相关，并没有问具体的基础问题也没有写算法题。

总结

前面的步骤正常发挥即可，老大面这块需要展现出在过往项目经历里累积的经验和知识，不然太容易被老大给K.O.掉了。（之前阿里某部门的技术老大面就是太没当回事儿被挂了）