记一次前端春招实习面经（已拿字节、腾讯offer）

前言

三月份过去了，笔者的春招实习面试也告一段落了。在这接近一个月的时间，经历了面试时的紧张、失败时的痛苦、拿到offer的兴奋。目前面了字节、美团、腾讯、清远墨墨、阿里。并拿到了字节、腾讯、清远墨墨的实习offer。
这次就先从笔者就从自己的心路历程结合面试干货娓娓道来。（ps:由于笔者没有面试完就及时写面经的好习惯，以至于一些细节有些忘记了。我会在想起来的第一时间回来补充）

初面试-字节跳动（头条部一面）

这是笔者人生第一次面试，有些紧张。面试官是一个有点严肃的小姐姐，看到她第一眼笔者就觉得是自己心目中程序媛的形象。

自我介绍
css选择器、优先级
标准盒模型和ie盒模型
js继承 (原型式、构造函数式、组合式、寄生式)
js判断类型（typeof 、 instanceof、 Object.prototype.toString.call）
settimeout和setinterval区别。宏任务、微任务、异步队列
一道考察promise的题

let j = ()=>{return  2
}
new Promise((resolve, reject)=>{resolve(1)
}).then(j).then(req=>{console.log(req);    //2
})

说几个http字段吧，作用是什么（content-type 、Cache-Control 、Etag）
跨域问题 node怎么配置跨域 (cros)
http状态码以及代表什么
cookie、session、token
node的框架学过吗 express、koa 区别？这里笔者主要讲了洋葱模型
笔试题 1.广度优先遍历二叉树 2.多维数组压平 3.翻转矩阵笔试题都不难，是leetcode的easy原题。

这次面试表现得不是很好，很紧张，写编程题的时候手都在抖。幸运的是当天晚上就被告知通过了。第二天开始二面。

字节跳动（头条部二面）
二面面试官是一个小哥哥，没有露脸，全程语音交流。

前端优化这个题比较开放，可以从减少资源请求、资源大小、优化网络、资源加载、回流重绘等多方面回答。
vuex状态管理存在意义？单向数据流、集中管理
vuex的action怎么触发？ dispatch
介绍下项目、难点？这个就不细讲了，每个人项目都不一样，答得让面试官觉得你在遇到问题时有思考的过程就好。
笔试题

1.实现一个add方法
add(1)(2,3)(4).value()   输出： 10function add(...num) {let curr = function (...out) {return add.apply(this, num.concat(out))}curr.value = function () {return num.reduce(function (pre, cur) {return pre + cur})}return curr
}
2.实现一个异步队列Queue，要求按时间依次执行callback
new Queue().task(1000, function () {console.log(1);
}).task(2000, function () {console.log(2);
}).start()答案1：
function Queue1() {this.queue = []this.task = (time, fn) => {this.queue.push({fn, time})return this}this.start = () => {let deffer = 0for (let i of this.queue) {deffer += i.timesetTimeout(i.fn, deffer)}}
}
答案2：function Queue2() {this.queue = []this.task = (time, fn) => {this.queue.push(function (resolve) {setTimeout(function () {resolve(fn())}, time)})return this}this.start = async () => {for (let i of this.queue) {await new Promise(i)}}
}

这次面试的笔试题写的时候全是bug，给面试官留下很不好的印象。不过这次面试结束的时候，面试官给了我一些学习上的建议，并给我一定的鼓励。晚上的时候HR来点说要进行评估，无奈评估未通过。不过想起二面时面试小哥哥对我的鼓励，决定再战。

清远墨墨
笔者最开始接触清远墨墨是考四级的时候下载了这个app（虽然从来没有真的用过）。面试的时候有个hr小姐姐加了我，给我介绍公司，通知我面试。
面试的时候是在企业微信上，boss和技术一起面我。

BOSS ：用过墨墨app吗（笔者很慌，撒谎说用过）
背了多少单词（更慌了，随口说100个左右）
怎么知道有墨墨这个app的（同学介绍）
你简历说你自己心思缜密，但是你简历上的句子的标点符号有问题啊。（emmm）
项目的UI问题
技术： JavaScript空数组是true吗？
JavaScript是单线程吗
js精度问题 0.1+0.2 === 0.3 //false
你觉得英语水平会影响编程吗（答影响不大）

原谅我只记住了这些，这次面试技术上更偏向于js基础知识，问了很多口头判断题，只需要回答yes or no就可以了。
如果有想去向清远墨墨这样的小公司实习的，笔者建议多了解这个公司的相关信息，因为很可能接触到BOSS的灵魂拷问。清远墨墨公司压力相比于大厂小，公司里养了很多猫，还是个猫咖。如果不是为了面包，笔者是很青睐这种公司的。虽然拿到了offer，还是婉拒了小姐姐，对方还很礼貌的问我，怎么不来了呢，是不喜欢广东吗？ T_T 。

腾讯PCG一面
这次面试是在电话上进行的，面试官小哥哥说话很清晰，问的问题也很细，总体来说表现还是可以的。

为什么学习前端？
了解python、go吗？了解python
node作为后端有什么优缺点？这里小哥哥告诉我node在高并发场景表现和性能存在瓶颈
做过音视频方面的吗？答做过网盘，有媒体文件预览功能
浏览器重拍重绘，怎么减少重拍重绘？
异步队列微任务、宏任务优先级
跨域方式有哪些？同源策略 cors、JSONP、postMessage 、代理服务器
JSONP实现原理？利用script标签和注册全局函数
localstorage、sessionstorage区别？
怎么实现一个水平居中的alert窗口？定宽高margin、calc、不定宽高transform、flex布局
webpack打包过程？

1.初始化 webpack.config.js 最后的配置结果
2.初始化compiler对象，注册所有配置的插件，插件监听webpack构建生命周期钩子。调用run。
3. 根据入口文件，分析模块依赖（深度遍历），treeshicking
4.对应的文件使用对应loader loader是一个函数右到左的顺序执行输入参数是一个字符串，输出参数也是一个字符串
5.得到每个文件结果，包含每个模块以及他们之间的依赖关系，生成chunk。webpack将所有的模块打包成一个函数
6.最后生成bound文件是一个自执行函数

用过你觉得最好用的webpack插件？答模块热替换插件
什么是SPA应用，相对于多页的缺点首屏缓慢、不利于SEO爬取
CDN的优势在哪里有用过吗（答出了优势，但没有用过）
浏览器缓存问题

强缓存 Expires 字段（受限制于本地时间）
catcel-control字段 max-age 、 public、 private 、no-store 、no-catch
协商缓存 Last-Modified服务器发往客户端、f-Modified-Since客户端发往服务器，携带 Last-Modified 不准确，引入Etag
Etag 文件的唯一识别符通常是计算文件内容的md5

浏览器资源加载优先级？答不了解，能给我讲讲吗，对面讲了下如图片资源，浏览器会优先加载用户可视的内容。
最近在读过什么书？深入浅出nodeJS
3:20 时，求时针分针之间的夹角。这里注意减去时针偏移的10度。
笔试模拟大整数相加、相乘

function add(a, b) {let res = ''let newA = a.split('')let newB = b.split('')let c = 0while (newA.length || newB.length || c) {c += parseInt(newA.pop() || 0) + parseInt(newB.pop() || 0)res = c % 10 + resc = c > 9 ? 1 : 0}return res
}
function multiply(a, b) {let arr = []let num = 0;for (let i of a) {let temp = numfor (let j of b) {if (!arr[temp]) arr[temp] = 0arr[temp] += (i * j)temp++}num++}for (let i = arr.length-1; i >0;  i--) {if (arr[i] > 9) arr[i-1] += parseInt(arr[i]/10)arr[i] = arr[i]%10}return +arr.join('')
}

这次面试感觉还不错，面试官小哥哥给我讲了很多东西，还告诉我他在工作中的实际业务，使用的技术栈，现在的前端发展。对我这样的双非学历也一视同仁，我个人是非常尊敬欣赏这样的面试官的。打call!
阿里钉钉
阿里钉钉是在钉钉上加了群，和群主老哥聊过几句，最后也是这位老哥面的我。上来就是两个笔试题。

1.函数防抖？function throttle(fn,delay) {  //节流let lasttime = 0return function () {let nowtime = new Date().getTime()if(nowtime-lasttime>=delay){fn.call(this)lasttime = nowtime}}}
2.爬梯子问题？
function jumpFloor(number)
{let fib = [0,1,2]if(number<3) return fib[number]for(let i = 3;i<=number;i++){fib.push(fib[i-1]+fib[i-2])}return fib.pop()
}

面试题

前端安全怎么防范XSS攻击？
如何进行转义
网络爬虫有了解吗
CDN主要用来解决什么问题？（负载均衡、就近原则）

这次面试和以前的面试遇到的问题差不多，但对面没有直接问我问题，而是从实际问题引导我回答。我能听出对面是在引导我回答某方面的知识，但是我就是没有听懂他到底想问什么。面试快结束时，他对我说：我和你是老乡，之前也有在钉钉上聊过，所以特意把你的简历拿到了我这里，不知道这对你是好事还是坏事。（听到这里我知道已经凉了）之后他还顺便提醒我，你爬梯子代码那里写的是 * 号，应该是 + 号。（我心里一阵凉风）。
心里很感谢这位钉钉的老哥，下定决心把平时模糊的概念一定要弄懂。

阿里CBU一面

html节点类型？块级元素和行内元素
vue的双向绑定原理？订阅发布模式和Object.defineProperties
vue3.0、2.0、1.0的区别？主要答的是虚拟DOM、proxy代替Object.defineProperties
为什么用proxy代替Object.defineProperties 后者只能监听已有属性变化，且不能监听数组的内容变化
vue的解析器原理？用template生成AST语法树分析
async浏览器支持情况，没有async的时候用什么模拟？（generator）
generator有什么作用？供for of 消费、利用next接口
三道很简单的编程题（前两个代码量有点多，把第三题分享出来）

 /* 字符串隐藏部分内容* mask('85022088'); // 85****88*/
function mask(str, char) {if (str.length <= 4) return str.replace(/\w/g, char)let newStr = ''let start = 0let mask = `${char}${char}${char}${char}`start = Math.floor(str.length / 2 - 2)newStr = str.slice(0, start) + mask + str.slice(start + 4, str.length)return newStr
}

这次面试总体感觉很不错，主要是因为面试官小哥人很幽默，面试氛围也很放松，和我闲聊了很多。这个小哥带给我很多积极能量，笔者希望能在以后遇到越来越多这样的人。

腾讯PCG二面
PCG二面很突然，早上刚起床来的电话，就匆匆开始了~

谈谈你的实习经历，过程中你遇到哪些问题，怎么克服的（这里主要谈了自己在技术上和同事协作遇到的问题，一顿胡编。。。）
两个用户，A在深圳带宽2M，B在上海带宽100M，请求一个服务器部署在黑龙江4kb的文件。谁更快？（个人认为理论上差不多，现实上B可能由于距离近会快一些。我的答案不一定正确）
浏览器地址栏输入网址到显示，发生了什么？大概过程如下：

DNS
迭代查询浏览器缓存记录、本地host文件记录、本地的DNS服务器
递归查询根服务器顶级域名、二级域名、权威服务器
逐层封装 tcp->ip->数据链路层(首部mac) 帧 ->比特流 -> 经过路由根据ip转发 -> ip解析到mac地址。逐层拆解。
tcp三次握手过程建立http连接
https、http
建立https连接（TLS/SSL握手）

1 客户端发送请求，支持的加密协议到服务端、服务端返回公钥和证书到客户端
2 客户端证书验证生成对称密钥随机数公钥对其加密,发送到服务端
3 服务器私钥解密发来的公钥，用公钥加密数据。建立通信

http重定向状态码等
浏览器通过解析HTML，生成DOM树，解析CSS，生成CSS规则树，然后通过DOM树和CSS规则树生成渲染树。渲染树。重排重绘。

这是个开放性问题，我也只能答到这种程度。

砝码分盐问题。 140g盐用2g和7g砝码，一个天平，三次分出50g、90g
反问环节这里我问道面试官我有哪里不足？对方很中肯的告诉我在计算机网络底层需要加强。

字节商业变现平台一面

怎么判断数组类型？ Object.prototype.toString.call([]).slice(8,-1) === ‘Array’
bind、call、apply区别
浏览器地址栏输入网址到显示，发生了什么？（这个和上边一样）
TCP三次握手为什么三次？
http状态码？
web通信技术? Comet（http流、ajax轮询）、SSE、 websocket
都接触过哪些后端语言？ node、python
react和vue的区别？答双向绑定和单向数据流
vuex的作用？状态管理、集中式管理、把公用数据抽象出来、便于开发维护
react和jquery有什么区别？声明式和命令式区别？
MVVM和MVC？

个人觉得是因为这次面试问的问题恰好都是我了解的，对面印象不错，甚至夸赞我基础很牢固。面完直接开始进行二面。
字节商业变现平台二面 + HR面
这次面试官是部门的leader，比较严肃

做过哪些项目
项目安全问题项目里md5在哪里加密（我答是前端加密）
防止XSS、CSRF攻击？
前端鉴权 token
有做过管理类的项目吗答无
一个算法题这个题笔者没有写出来，但是说了说思路，并表示自己算法很菜
有什么想问的？笔者问商业变现平台是做啥子的blabla…

大概是这些问题，有点记不清了。面完后就被告知通过了，等HR。两天后HR面，主要是问问你的优缺点，最近在读什么书，平时成绩如何。面完的两个小时便拿到offer，不得不说字节的效率是真的很高。个人觉得之所以字节发展的如此之快，和字节的务实、技术气氛浓厚，在管理上扁平化，有着很大关系。

这里拿到字节的offer后，网易来电面试，因为地域问题（笔者是东北银），婉拒了这次邀请。

腾讯CSIG交叉面 + HR面
过了大概几天开始腾讯PCG三面，这段时间拿到字节offer后面试欲望十分低迷。在PCG三面的时候我拒绝了接下来的面试。对面问了我为什么不面了，去了哪家公司，表示尊重选择。戏剧性的是，之后过了两天腾讯CSIG部门来电，我表示不太想继续面的时候，对方表示理解，告诉我之前PCG的面试的评价还不错，并问我如果直接发offer，是否愿意来腾讯。笔者当时很惊讶，答了愿意。没想到直接发邮件邀我三面。
三面面试官明显是一个大佬，在腾讯会议上面试，主要问了些项目的细节，全程只有不到20分钟，之后就进入到了HR面。
HR面的时候，对方迟到了10分钟，我连忙打电话过去问，HR小姐姐抱歉说刚刚在开会，之后电话面了20分钟。一周后拿到正式offer。

美团到店事业群凉面
这次面试我没有任何准备，来的很突然，拿到三个offer的我不禁有些得意，以为能掌控一切，没想到凉凉。。。

计算机网络七层模型
IP在哪一层传输层。应用层有哪些协议 HTTP、FTP等
讲讲TCP四次分手
UDP、TCP区别
TCP流量控制、拥塞控制？滑动窗口、拥塞窗口，慢开始、快重传、快恢复
你觉得QQ聊天是用的什么协议。我答TCP，对面说是UDP，TCP开销太大。
十大排序算法？复杂度？
平时成绩怎么样，我答中等生，还挂过一科。
你为什么来美团（我答经常用美团订外卖吃，他说你这个回答牵强了点）
笔试题：和为S的连续正数序列

function FindContinuousSequence(sum)
{let [start,end] = [1,2]let result = []while(start<end){let total = (start+end)*(end-start+1)/2  //这里把求和公式忘掉了，最后还是对面提醒的我。if(total<sum)end++else if(total>sum)start++else{let list = []for(let i=start;i<=end;i++){list.push(i)}result.push(list)end++  //start++}}return result
}

这次面试问的大部分都是项目相关的事。面试老哥操着一口标准的东北话，跟我聊了50分钟，大部分时候都是我俩在那哈哈哈的笑，或者是他在那沉默。个人感觉表现的不是很好，不过手里有offer，挂了也没所谓啦。

阿里CBU二面

自我介绍
项目安全（这里和我探讨了下localstorage存放token有哪些安全问题，如何让改善）
vue、react区别
vue除了父子传值还有哪些办法？ eventbus、vuex
socket.io协议降级有了解吗？
koa框架和原生node有什么不同？
XSS攻击

这次面试谈到项目时说了我做的云盘和聊天室，对方表示怀疑我是在培训班做的，我表示我只是个大三学生呀（哪有钱报培训班）。虽然问到的几乎所有问题都答了出来。但对面表示项目上没有亮点，建议我我在一些方向继续深挖。
我很感谢面试官的建议。笔者虽然基础还OK，但是确实在项目上有所欠缺，对面也是很看重项目经验。
之后对方部门组加了我微信，问到拿到哪些offer后（说了腾讯），表示可以去深造半年，秋招的时候会再次主动联系我。（那好吧）。有些遗憾的是，笔者春招是第二次与阿里失之交臂了，唉，菜是原罪啊。

尾声
笔者的面试经历大概就是这样了，感谢你的阅读。希望我们一起加油，为了搬砖努力把~

记一次前端春招实习面经（已拿字节、腾讯offer）相关推荐

我的春招实习总结：已拿字节，快手，美团Offer
前言从二月初开始投简历,到现在字节入职一周,也两个多月了,想抽空记录一下最近的一些经历. 1. 心得体会牛客网别人的帖子: 写给20届毕业生的求职指南给正在备战春招/暑期实习的同学一些小建议找 ...
【前端春招】前端春招实习+秋招心路历程
想写这篇由来已久了,大抵是自己比较懒惰,所以拖了这么久,从2021的3月份决定走前端然后春招开始,一直在白嫖面经帖子并受益良多,面经帖子很多,但是关于感受感想和一些经历的思考帖子不太多,在春招面试的路 ...
22届春招实习试水之路汇总（前端+后端）
目录写在前面时间线记录第一批投递(后端) 第二批投递(前端) 第三批投递(前端+后端) 面经 5.29 搜狐前端实习一面(焦点)- 视频面45min - 口头offer被鸽自我介绍+项目相关 ...
2022春招实习面经【美团、阿里、微软、字节、米哈游】
目录写在前面一,美团--快驴事业部 1,时间线 2,笔试 3,面试一面二面二,阿里--大淘宝技术 1,时间线 2,笔试 3,面试一面二面三,微软--苏州STCA 1,时间线 2,笔试 ...
春招实习之路（附面经）-Laochou
春招实习之路(附面经)-Laochou 本人Laochou,这篇推文主要是分享一下我的春招实习的历程. [时间线] 2020.03.01 这一天,我记得很清楚.这是我人生中的第一次面试,结果是惨不忍睹 ...
2021年金三银四春招实习回顾
好久没写博客了,没有消失哦,只是准备春招实习去了,哈哈,一下子两个月就过去了,春招经历了很多,面试了多家公司,下面说一下百度,腾讯,好未来者三家公司的面试经历! 一:百度一二面这是我第一次经历面试, ...
江浙沪的java春招实习综合面经
最近也是每天刷牛客看了很多大家的帖子,自己结束春招,把之前的记录分享给大家把. 投递公司搜狐焦点爱奇艺散招,快手,金陵科技, 地平线, 有赞,YuxiSoft,搜狐,科大讯飞,腾讯微信,趋势,酷家 ...
『Android春招实习攻略』2022年中总结
『Android春招实习攻略』2022年中总结自我介绍: 23届毕业生,目前大三下在读,双非科班,经历了半年春招实习招聘大学期间,属于普普通通学习型学生,间歇性踌躇满志,习惯性混吃等死. 绩点中上 ...
2021春招实习面经__C++/后台开发
记录一下春招实习的面经. LZ东北大学(秦皇岛)非科班大三(材料成型及控制工程),春招实习拿到了阿里百度快手华为的offer,算是为在北京和学校的四个月刷题+学习画上了句号.因为我每一次面试都会记录内 ...

记一次前端春招实习面经（已拿字节、腾讯offer）

前言

记一次前端春招实习面经（已拿字节、腾讯offer）相关推荐

最新文章

热门文章