字节跳动前端实习面经(三轮技术面+hr面)2020.12

个人背景

本人研二，科班，学前端时间四个月左右，有做过react小程序，但是对react的理解不是很深。有一段四个月的前端实习经历，用的是vue。投的字节跳动北京的base。

一面 60min

最近在学什么？node.js，为什么要学node.js，讲一下你学到node.js的哪些知识

常见数据类型？
ES6有哪些数据类型，set和map区别？set放NaN会有几个？NaN全等于NaN吗？答不全等，问那为什么set里面只能放一个

问输出，考察this指向：

// Q1
var a = 1;
function print () {
 console.log(this.a)
}
​
print()
// Q2
const obj = {
 a: 2,
 print: function () { console.log(this.a) }
}
obj.print();
​
// Q3
const obj = {
 a: 3,
 print: function () { console.log(this.a) }
}
​~~~~
const foo = obj.print; 
foo()
​
// Q4
const obj = {
 a: 4,
 print: () => { console.log(this.a) }
}
obj.print();
​
// Q5
var a = 5
const obj = {
 a: 6,
 print: () => { console.log(this.a) }
}
obj.print.call({a: 7});
​
// Q6
function Person () {
 this.a = 8
 this.print = function () {console.log(this.a)}
 return {a: 9}
}
​
const p = new Person()
console.log(p.a)
console.log(p.print())
​
// Q7
'use strict';
var a = 1;
​
function print () {
 console.log(this.a)
}
print()**

判断数组的几种方法？为什么要用Object.prototype.toString(),

数组的.toString()不行吗，输出什么

讲一下事件流，怎么阻止冒泡？如何移除事件绑定？

flex常见属性，如何实现类似快手这种视频列表的瀑布流布局(一行两个) flex:1的含义

又讲一下你觉得自己写的最好的一个组件？

编程题：

1. 什么是面向对象？面向对象特性？与面向过程的区别？
   把大象放进冰箱 分别用面向对象，面向过程，函数式编程实现。
2. 求二叉树每层的最大节点，放入数组输出。(需要自己构造一棵二叉树去验证) 问优化：怎么只用一层循环实现层序遍历

这个题简直一题顶三题啊……

1.  求二叉树每层的最大节点 
2.  构造一棵二叉树
3.  一层循环实现层序遍历

由于解答过程比较长，单独写了一篇文章总结一下这个题的思路和完整代码 https://segmentfault.com/a/11...

1. 实现复杂版本的bind，可new可继承

  // 可new可继承版本的bind
  Function.prototype.bind = function (context, ...outerArgs) {
      let that = this;
      function res (...innerArgs) {
        if (this instanceof res) {
          // new操作符执行时
          // 这里的this在new操作符第三步操作时，会指向new自身创建的那个简单空对象{}
          that.call(this, ...outerArgs, ...innerArgs)
        } else {
          // 普通bind
          that.call(context, ...outerArgs, ...innerArgs)
        }
      }
      res.prototype = this.prototype //！！！
      return res
    }

其他：问了实习项目，主要关心做的项目的作用和难点

一面总结：一面问的还是比较基础的，算法和手写都是常考的类型，但是面试官除了前端相关的知识之外上来就问到面向对象和面向过程的思想，以及函数式编程，说明面试官还是比较注重编程思想的。

二面 50min

跨域，需要解释具体实现过程

react和vue的区别

vue 路由，hash和history的区别，你们项目中是怎么进行状态管理的，怎么配置路由的？

常见的HTTP请求以及每个请求的作用？GET和POST的区别

ES6 ，ES7新特性？

前端安全措施，常见的安全问题，XSS？CSRF

https ca证书的作用，SSL层的作用

路由切换页面的原理？？

vue和react的区别？

问输出：

// 1.
a = 100;
let a;
a = 10;
function test(num) {
console.log(a);
 a = num;
}
console.log(a);
test(5);
console.log(a);

// 2.
const a;
a = 10;（会报错）

编程题：

1. 实现一个函数，将输入的数组转为链表，并实现一个方法向链表指定位置插入值
2. 两个无序数组合并成一个有序数组，问时间复杂度。 延伸：快排和冒泡排序的时间复杂度，使用场景
3. 实现toFix函数

二面虽然问的没有很难，但自己答得不是很好，跨域和安全也都答不上来，太久没复习全忘了，手写题答得还可以。本来以为希望不大，结果面完之后面试官立刻问我有没有时间，要继续三面。 结果三面的面试官没有时间，改到后天了，还能有机会再复习一下

三面 80min

你知道的数据结构有哪些？

数组是数据结构吗？不是，那为什么？什么是数据结构

你刚刚说到了堆，堆是一种新的数据结构吗？不是，是完全二叉树。什么是完全二叉树？

树和图的区别？ 图的应用场景？

react生命周期，忘记了，说了vue的,各个生命周期的作用？

网络模型以及每层的协议？

CSS：

css动画的实现方式？具体一些
position每种属性的作用

如何尽可能发现代码中的bug，有没有一些工具去辅助

编程题：

1. 说一下instanceof的原理，实现一下
2. 知道map方法吗？实现一下。 reduce和基本版都写了
3. 实现ajax，至少实现get和post方法。这里深挖了get和post具体的传参方式以及ajax中具体是如何实现的
4. 实现一个模态框组件，用vue和react均可(要能传递确定取消事件函数，有遮罩，居中)

其他：

项目难点和收获

对哪种框架比较熟悉

别人的评价

自身的优点和缺点

压力最大的时候？怎么排解压力

你对于以后前端学习的规划？

三面结束后，过了20min HR小姐姐就给我打电话约了下午HR面

三面问了足足80分钟，面试官从数据结构，计算机网络，js原理，到原生API实现，组件实现，比较注重面试者对实现原理的思考(而不是单纯的只会用这个API或者这个组件)。另外也会考察考察面试者的综合素质和抗压情况。

ps: 感觉三面的面试官是个大佬，比较严肃有气势，我有的不确定的东西可能说话带着疑问句，他就直接说你不要问我是不是，直接说就就行了。 面试官比较直接，我答的出来的题他就直接说看来这个题你已经掌握了，我答的不好的他也当场说你这个题答得不好。比较庆幸自己面试的前一天晚上复习时押了几个题，押到了网络模型以及每层协议，手写ajax和map的实现,要不然这场面试估计凉凉，还是自己太菜了~~唉

另外有一个小插曲是之前字节同学有说面试官可能会问前面的面试答的怎么样，有哪些不会的，可能会再问有没有学习，所以我就把前面遇到的不会的也看了一下。 但三面面试官出题的时候说了一句让我看看前面还有哪些没出过的，要找没出过的题考我，所以这个还是分人分部门啦~

HR面 40min

之前遇到的hr面都是电话面，这次的比较正式，让下载飞书，通过飞书进入链接地址进行视频面试。

对前面的面试有什么感受？

你觉得三位面试官是怎么样的人？为什么？

如何准备面试的？之前有看过面经吗？

喜欢团队合作还是自己工作

合作遇到不好相处的人怎么办？

团队利益优先还是个人利益优先？

讲一讲最近在看什么书

户籍所在地？高考考了多少分？

兴趣爱好？

最黑暗的时刻？怎么排解

对考研成绩和学校满意吗？

对未来职业发展的规划？

分别用三个词形容自己，同事和朋友怎么形容你？

平时都是怎么学前端的？
(在这里我有说到喜欢通过看技术文档学习，HR小姐姐表示那字节还挺适合我的，因为内部有很多技术文档可供学习)

github有经常更新吗？

介绍了上下班时间，薪资待遇

问了能实习多久，并且表示如果在这边实习到毕业可以直接转正（本人2022届的研究生），也说如果考虑到毕设的话是可以请长假的，一个多月的那种长假。

总之，hr面就比较轻松了，和小姐姐聊的挺愉快。

总结

最后，结合这次面试和前面字节其他部门的面试来看，感觉字节还是很注重基础和底层原理的。

框架类的东西问的不太多，主要还是js要学好(会考手写call, bind, apply, ajax, promise, map方法)，还有计算机网络的东西，尤其是与HTTP请求相关的知识也一定要掌握。

编程题: 算法不会问的太难，基本都是简单的难度，大多会结合数据结构来考，比如树和链表的操作，另外还要掌握至少三四排序算法以及其时间复杂度。 也会让手写一些简单的api，或者封装一个组件，算法和一些简单的API一般都是需要当场运行的，所以写的时候要细心，如果运行总是报错就很尴尬了。

常考手写可参考另一篇文章，覆盖了容易考到的各种高频手写~~ https://segmentfault.com/a/11...

项目方面考察的点：

* 项目内容，所用技术，自己在里面做了哪些工作
* 项目的难点和最大收获(谈难点时通常会问的特别深入，避免给自己挖坑)
* 项目中遇到的其他问题(可以是非技术上的)，你会怎么解决？

hr面： 主要关注候选人的这几个点：

* 学习成绩，在校经历
* 团队合作能力，处理团队问题的方式
* 抗压能力
* 个人性格，爱好
* 能否长期实习，有无转正意向
* 对未来职业发展的规划
* 学习能力