阅读 5108

一年外包经验前端怎么入职字节

写在最前

我是晨霜,于20年毕业于一所双非本科,在经历了一个月左右的面试流程之后,如愿以偿的拿到了字节的offer,本篇主要记录此次面试经历,希望能够对你有所帮助。

准备面试

机会是留给有准备的人的。

笔者之前在阿里巴巴本地生活做外包,由于外包工作性质的特殊性,遂在三月底就已经开始准备面试了,主要准备的是算法和React。

准备算法

先来讲讲算法吧,当时笔者是一个算法小白,连时间复杂度都不会算的那种,下面先来讲讲笔者是如何学习算法的。

个人认为算法的难度确实偏大,如果一上来就看诸如《算法导论》的书籍或者相关文章, 肯定会一头雾水,甚至可能会适得其反,那么此时就需要一个非常好的入门课程来学习。这里推荐ssh大神都推荐的波波老师的视频教程 玩转算法面试,真的非常赞,波波老师会从最基础的讲起,还会用动画的形式来帮助你理解算法。笔者大概花了一个月的时间学完了该课程,跟着视频刷了100多道leetcode,学完之后,思维真的提升了很多。

顺便放一个github地址 JavaScript算法与数据结构,这个比较全面,但不适合入门。

可能会有人认为不进大厂就不需要学习算法,我个人认为学习算法是一定有用的,只要你是一个稍微有点追求的程序员,就一定会去学习算法。综合来看笔者过去一个月的面试,虽然算法在面试中占的比例不高,但却非常关键,例如笔者在面阿里的时候首先就是做算法题,做过了才有后续面试。

准备React

首先是hooks,都2021年了,hooks已经成为人手必备的技能了吧,这里推荐Dan的 useEffect完整指南,看完这个,hooks相关的问题都能迎刃而解。

React这里推荐卡老师的 React技术揭秘,你想知道的React知识都在里面,例如React为什么要费力做Concurrent Mode,Fiber是什么(非常高频的一个考点),React更新流程又是什么,hooks的原理等等。u1s1,卡老师没有出小册而是选择免费开放给大家,瑞思拜。

一些其他

在准备完算法+React之后,还需要准备一些其他的,这里就直接放链接了,不过更多的还是在于平时的积累。

面试过程

字节的面试用的是牛客网,形式是视频面试+在线写代码,第一次面试还是比较紧张的。

一面

一面面试官是一个很年轻的同学,因此问的问题也会比较年轻一些。

  • React17更新了哪些内容?
  • React的fiber是什么?解决了哪些问题?
  • setTimeout为什么最小只能设置4ms,怎么实现一个0ms的setTimeout?
  • 看你简历上有写到rem和vw,能讲讲吗?为什么你选择使用rem而不是vw?
    • 当时回答是rem兼容性更好,且px转rem后可以避免过长小数。
  • 浏览器对于小数单位是怎么计算的?
    • 当时没答上来,只说了句四舍五入,后续查阅相关资料得知不同浏览器策略不同,有的会四舍五入,有的会直接取整。不管什么单位,浏览器最后都会Computed为px后再进行渲染。
  • interface和type的区别是什么?你日常工作中是用interface还是type?
  • ts的逆变和协变有没有了解过?
    • 没有
  • 能不能讲讲小程序的原理?
    • 网上很多相关文章,把双线程讲出来就行。
  • 看你之前有做过Taro,能不能讲讲React是怎么跑在小程序里面的?
    • 大概把Taro3的原理讲了一遍,主要是jsx->vdom->json->wxml,具体可以看这里 Taro预渲染Remax实现原理 ,之前写过demo,所以对这块还是比较了解。
  • 你刚才讲到json->wxml这一步可以有两种方式(template递归和自定义组件递归),能不能讲讲两种方式的优劣?
    • 简单讲了一下,template递归是纯视图层的操作,性能肯定更好,但是由于微信小程序wxml编译器的限制,template不能递归调用自己(支付宝小程序无此限制),所以Taro在微信环境中把同一个template写了n份,只有id不同,就是为了递归渲染。
    • 而自定义组件递归还要涉及到逻辑层,例如生命周期等,性能会差一些,同时还有Shadow DOM引起的样式问题,目前kbone使用的是自定义组件递归。
  • 小程序有没有HMR,能不能讲讲HMR的原理?
    • 小程序没有HMR,当时只讲出来了保存代码小程序是怎么刷新的,HMR没有讲出来。
  • 讲讲z-index
  • 讲讲position
  • 实现一个ts Include
    • 不会
  • 实现一个useInterval
    • 写的不是太对
  • js event loop执行顺序
  • 实现一个immutable
    • 这里给一个大佬的实现,我实现的太菜
    function immutable(obj) {
      return {
        set(path, val) {
          const paths = path.split('.')
          const lastK = paths.pop()
          this.get(paths.join('.'))[lastK] = val
          return this
        },
        get(path) {
          const paths = path.split('.')
          return paths.reduce((a, k) => a[k], obj)
        }
      }
    }
    复制代码

一面到这里就结束了,可以感受出来,字节对于前沿技术和底层还是很看重的。当时手写题部分确实写的不太好,甚至以为自己凉凉了,结果还是给过了。

二面

一面结束后第二天就收到了hr打来的约二面的电话,当时心里还是很开心的,二面是交叉面试,面试官年纪稍微大一点。因为是在晚上,所以很多问题记不太清楚了。

不同于一面面试官,和二面面试官聊了一段时间的项目相关的问题,根据自己情况有啥说啥就行。

  • options请求是什么?有什么作用?
  • cdn的原理是什么,是在网络哪一层起的作用?
  • 项目性能是如何做优化的?
    • 我主要从网络,缓存,js,css,接口合并等几个方面讲的,该题比较宽泛,可自行发挥。
  • 动态创建script标签并插入到页面上,说执行时机
  • 给你一个“A2B3”这样的字符串,输出“AABBB”
  • 接上题“C4(A(A3B)2)2”,带嵌套的,这两题都不是原题,但是类似
  • 写一个curry,要求 add(1)(2)(3)(4) 打印10
    • 一开始我写的add(1)(2)(3)(4)(),面试官问我能不能把最后的()去掉,最后寻求提示,他说console.log是怎么打印函数的,豁然开朗,复写toString即可。

二面肯定不止问了上面这些问题,但是我能记住的只有这些了。。。

我最后问了二面面试官业务相关问题,他说你去找三面面试官问,当时我就知道过了,哈哈。

三面(凉凉)

没错,第一次三面凉凉了,甚至都已经收到面试失败的邮件,后面会聊,先看问题。

  • loader和plugin的区别是什么?
  • webpack打包优化,我还提到了vite,顺便讲了下vite
  • 小程序原理,以及Taro原理
  • xss和csrf
  • http2
  • Tree Shaking原理
  • 最长回文子串
  • 大数相加

这次面试非常快,因为确实很多都没答上来,面完之后我就知道,结束了😭。

三面

大概几天后吧,hr打电话跟我说换个leader重新面试,理由是我一二面表现还不错,后来才知道,真正的原因是我现在的leader执意把我捞起来的。

  • 聊了很多工程化相关的问题,主要是项目从开发到上线这一整套流程,聊完之后他也指出了我说的这一套流程有什么不完善的地方。
  • React fiber
  • http2
  • Tree Shaking原理
  • 项目优化和网络优化
  • 股票最大收益
  • 大数相加

其实在这场面试之前,面试官特意让我等了10分钟,应该是在看我之前没写出来的问题,所以在问的时候特意问的和第一次三面比较重叠。

总结

进来之后leader和我说之所以把我捞起来是因为觉得我有潜力,他也指出其实我面试表现并不是太好,还是有很多可以继续改进的地方,他说优秀的人是会自驱的,你第一次没答上来,如果你是一个优秀的人,你第二次一定能答上来,非常感谢我现在的leader。

如果你跟笔者一样,工作经验少,学历不够好,担心投大厂被拒,想等几年再投,那我建议你大可不必,随着你工作经验的增加,大厂对你的要求也会增加,你能确定这几年你的成长速度能跟上大厂对你的要求吗?种一棵树最好的时间是十年前,其次是现在。

写在最后

笔者目前就职于字节跳动-抖音电商部门,目前团队在北京和上海都还有非常多的hc,有兴趣的可以投递简历到suchangv@bytedance.com或者加我微信suchangvv找我内推。 祝大家都能找到心仪的工作。

文章分类
前端
文章标签