字节前端面经
一面:
1. 自我介绍
2. Event Loop读代码
3. js闭包概念，应用（防抖，节流）
4. 手撕每隔一秒输出数组中的一项，多种方式 setInterval，setTimeout递归，遍历setTimeout 时间为index*1000,async/await和Promise实现 await返回的是什么？Promise
5. css选择器优先级
6. 后端返回HTML到显示在浏览器中间发生了什么
7. http头设置什么可以用来获取用户ip地址？ 没答上来
8. http状态码知道哪些，分别代表什么 100 102 200 201 202 301 302 304 400 401 403 404 500 503
9. 什么是虚拟DOM；
10. Vue数据响应式怎么实现的？ 发布订阅模式11. 谈一下Vue的Diff算法
12. 浏览器路由？ History和Hash模式，当时答得不是很好 ，结合Vue-router讲的
13. 手撕代码
```js
请为所有数组对象添加一个flatten()方法, 返回其扁平结构
Q: tip: 跳过[], null, undefined
/ test case1
[[[[[0]], [1]], [[[2], [3]]], [[4], [5]]]].flatten() => [1,2,3,4,5]
// test case2 [['a','b'], [0,['a']], [false], null].flatten() => ['a','b',0,'a',false]
//我的实现
let arr = [[[[[0]], [1]], [[[2], [3]]], [[4], [5]]]];
let arr2 = [['a','b'], [0,['a']], [false], null]; Array.prototype.myFlatten = function (){ return this.reduce(function(pre,cur,index){ if(cur==undefined) return pre; else{
return Array.isArray(cur)?pre.concat(cur.myFlatten()):pre.concat(cur); } },[]); }
let array = arr.myFlatten();
let array2 = arr2.myFlatten( ); console.log(array2);
``` 一面结束后现场通知的二面二面：
1. 自我介绍一下
2. 平时怎么学习前端的？
3. 三栏布局有哪些实现方式？ 谈了float flex布局 relative+absolute table-cell4. 用css 把色子 3 的那一面实现一下 ,只需要写布局部分即可 ```html <div class='container' > <div class="point"></div> <div class="point"></div> <div class="point"></div> </div> ```
5. 读代码，大概是一道this指向的题目，输出结果并且解释，好像是考察了返回匿名函数指向window
6. webpack了解吗？ 我说只有用vue-cli自动配置，平时就使用proxyTable配置代理服务器，其他看过文档没有实践过。面试官说，没事，不是很熟悉就不问这个了
7. 配置代理服务器，所以追问了一下各种跨域方式以及具体的实现，这个之前去仔细了解过，大概答了JSONP前后端结合，CORS纯后端，代理服务器纯前端，以及不是很常用的window.postMessage(),然后还扯到了nginx反向代理也是一种纯后端的解决方案。
8. 讲一下token？ 我大概把cookie，session，token结合讲了一下
9. 讲token的时候，谈到了自己选修过安全方面的，问了一下，CSRF是什么，且应该怎么样区防范，谈到了检查http请求的refer字段，追问如果refer字段也被伪造了呢，没答上来。面试官表示就聊聊，这个不知道也没事
10. 手撕 bind函数 这个面试前准备过apply call bind手撕都应该掌握
11. 来一道算法题
```js 给定一个无序的整数数组，找到其中最长上升子序列的长度。 * 输入: [10,9,2,5,3,7,101,18] * 输出: 4 * 解释: 最长的上升子序列是 [2,3,7,101]，它的长度是 4。 我的实现
function getNum(array){ let max = 0; for(let i=0;i<array.length;i++){ let temp_max = 1; let temp_value = array[i]; for(let j=i+1;j<array.length;j++){ if(array[j]>temp_value){ temp_value = array[j]; temp_max++; max = Math.max(max,temp_max); } } } return max; } ```
12. 有什么问题想要问我的？ 问了一下在贵公司平时前端具体工作是做一些什么呢？
二面结束一小时收到三面通知
三面：面试官比较严肃
1. 讲一下平时是怎么学习前端的？
2. 看你的简历里面提到参加了很多比赛，给你带来的收获是什么
3. 简历里面的垃圾分类小程序，你完成了哪些部分 ？ 全栈加训练模型，前端用wx小程序开发，后端用flask框架，数据库采用mysql，模型用了pytorch框架，使用了开源的resNet18训练模型的。
4. 在开发这个小程序的难点是什么？ emmmm因为前后端比较简单，就讲了训练模型的过程，调参，cuda。
5. 怎么提高准确率的？ 用python爬取数据集，筛选符合要求的图片分类，然后修改分组大小，图片大小，图片旋转等等，控制变量法看哪个正确率高？ (这块当时做的时候也是不是很清楚原理，不知道答得怎么样)
6. 简历中的C2C众包项目你完成了哪些部分？ Vue+VanUI+Cordova 跨平台开发的移动端，完成了主页，模糊搜索任务，任务发布提交，任务地图等等功能
7. 你简历中说到任务地图实现了Marker的合并，具体是怎么实现的？ 用一个数组存marker，当后端传来数据时，遍历往数组里面添加，判断和已有marker的距离，如果小于一定值，则直接添加到这个marker下面，实现随着地图放大缩小，不同情况下的marker聚合显示状况
8. marker图标是怎么实现的？ 直接调用的高德地图默认的图标
9. Vue组件写过吗，写个基本的模板
10. Vue自定义指令用过吗，写一下。 这个语法忘记了，但是讲了一下Vue指令在底层是怎么解析的
11. 怎么给一个数据结构添加迭代器？ 谈到了es6中的迭代器，具体怎么实现谈到了原型上面添加属性和遍历方法，不知道答的对不对
12. JS CSS HTML Vue哪个比较了解？答了Vue，最近在学习写Vue底层源码
13. JS掌握的怎么样？还行
14. BOM和DOM的区别是啥？ ....一道很基础的题目当时没想起来，尴尬
15. 有自己的实习计划么？ 没课了，可以马上过去实习
16. 你有什么问题要问我吗? 问了一些关于新人培养的政策
总体来说 一面二面表现得都挺好，三面有点拉垮。
过了一个礼拜左右通知面试通过了，发了意向书
10.29开奖了，sp，太开心了，谢天谢地。#字节跳动##前端工程师##面经##校招#
1. 自我介绍
2. Event Loop读代码
3. js闭包概念，应用（防抖，节流）
4. 手撕每隔一秒输出数组中的一项，多种方式 setInterval，setTimeout递归，遍历setTimeout 时间为index*1000,async/await和Promise实现 await返回的是什么？Promise
5. css选择器优先级
6. 后端返回HTML到显示在浏览器中间发生了什么
7. http头设置什么可以用来获取用户ip地址？ 没答上来
8. http状态码知道哪些，分别代表什么 100 102 200 201 202 301 302 304 400 401 403 404 500 503
9. 什么是虚拟DOM；
10. Vue数据响应式怎么实现的？ 发布订阅模式11. 谈一下Vue的Diff算法
12. 浏览器路由？ History和Hash模式，当时答得不是很好 ，结合Vue-router讲的
13. 手撕代码
```js
请为所有数组对象添加一个flatten()方法, 返回其扁平结构
Q: tip: 跳过[], null, undefined
/ test case1
[[[[[0]], [1]], [[[2], [3]]], [[4], [5]]]].flatten() => [1,2,3,4,5]
// test case2 [['a','b'], [0,['a']], [false], null].flatten() => ['a','b',0,'a',false]
//我的实现
let arr = [[[[[0]], [1]], [[[2], [3]]], [[4], [5]]]];
let arr2 = [['a','b'], [0,['a']], [false], null]; Array.prototype.myFlatten = function (){ return this.reduce(function(pre,cur,index){ if(cur==undefined) return pre; else{
return Array.isArray(cur)?pre.concat(cur.myFlatten()):pre.concat(cur); } },[]); }
let array = arr.myFlatten();
let array2 = arr2.myFlatten( ); console.log(array2);
``` 一面结束后现场通知的二面二面：
1. 自我介绍一下
2. 平时怎么学习前端的？
3. 三栏布局有哪些实现方式？ 谈了float flex布局 relative+absolute table-cell4. 用css 把色子 3 的那一面实现一下 ,只需要写布局部分即可 ```html <div class='container' > <div class="point"></div> <div class="point"></div> <div class="point"></div> </div> ```
5. 读代码，大概是一道this指向的题目，输出结果并且解释，好像是考察了返回匿名函数指向window
6. webpack了解吗？ 我说只有用vue-cli自动配置，平时就使用proxyTable配置代理服务器，其他看过文档没有实践过。面试官说，没事，不是很熟悉就不问这个了
7. 配置代理服务器，所以追问了一下各种跨域方式以及具体的实现，这个之前去仔细了解过，大概答了JSONP前后端结合，CORS纯后端，代理服务器纯前端，以及不是很常用的window.postMessage(),然后还扯到了nginx反向代理也是一种纯后端的解决方案。
8. 讲一下token？ 我大概把cookie，session，token结合讲了一下
9. 讲token的时候，谈到了自己选修过安全方面的，问了一下，CSRF是什么，且应该怎么样区防范，谈到了检查http请求的refer字段，追问如果refer字段也被伪造了呢，没答上来。面试官表示就聊聊，这个不知道也没事
10. 手撕 bind函数 这个面试前准备过apply call bind手撕都应该掌握
11. 来一道算法题
```js 给定一个无序的整数数组，找到其中最长上升子序列的长度。 * 输入: [10,9,2,5,3,7,101,18] * 输出: 4 * 解释: 最长的上升子序列是 [2,3,7,101]，它的长度是 4。 我的实现
function getNum(array){ let max = 0; for(let i=0;i<array.length;i++){ let temp_max = 1; let temp_value = array[i]; for(let j=i+1;j<array.length;j++){ if(array[j]>temp_value){ temp_value = array[j]; temp_max++; max = Math.max(max,temp_max); } } } return max; } ```
12. 有什么问题想要问我的？ 问了一下在贵公司平时前端具体工作是做一些什么呢？
二面结束一小时收到三面通知
三面：面试官比较严肃
1. 讲一下平时是怎么学习前端的？
2. 看你的简历里面提到参加了很多比赛，给你带来的收获是什么
3. 简历里面的垃圾分类小程序，你完成了哪些部分 ？ 全栈加训练模型，前端用wx小程序开发，后端用flask框架，数据库采用mysql，模型用了pytorch框架，使用了开源的resNet18训练模型的。
4. 在开发这个小程序的难点是什么？ emmmm因为前后端比较简单，就讲了训练模型的过程，调参，cuda。
5. 怎么提高准确率的？ 用python爬取数据集，筛选符合要求的图片分类，然后修改分组大小，图片大小，图片旋转等等，控制变量法看哪个正确率高？ (这块当时做的时候也是不是很清楚原理，不知道答得怎么样)
6. 简历中的C2C众包项目你完成了哪些部分？ Vue+VanUI+Cordova 跨平台开发的移动端，完成了主页，模糊搜索任务，任务发布提交，任务地图等等功能
7. 你简历中说到任务地图实现了Marker的合并，具体是怎么实现的？ 用一个数组存marker，当后端传来数据时，遍历往数组里面添加，判断和已有marker的距离，如果小于一定值，则直接添加到这个marker下面，实现随着地图放大缩小，不同情况下的marker聚合显示状况
8. marker图标是怎么实现的？ 直接调用的高德地图默认的图标
9. Vue组件写过吗，写个基本的模板
10. Vue自定义指令用过吗，写一下。 这个语法忘记了，但是讲了一下Vue指令在底层是怎么解析的
11. 怎么给一个数据结构添加迭代器？ 谈到了es6中的迭代器，具体怎么实现谈到了原型上面添加属性和遍历方法，不知道答的对不对
12. JS CSS HTML Vue哪个比较了解？答了Vue，最近在学习写Vue底层源码
13. JS掌握的怎么样？还行
14. BOM和DOM的区别是啥？ ....一道很基础的题目当时没想起来，尴尬
15. 有自己的实习计划么？ 没课了，可以马上过去实习
16. 你有什么问题要问我吗? 问了一些关于新人培养的政策
总体来说 一面二面表现得都挺好，三面有点拉垮。
过了一个礼拜左右通知面试通过了，发了意向书
10.29开奖了，sp，太开心了，谢天谢地。#字节跳动##前端工程师##面经##校招#
百度一面498人在聊
查看15道真题和解析