背景

双非一本，前端开发 实习生，去年7月开始准备的实习 7月~8月hc，9月到3月js，3月底vue框架。

项目：导航 & 个人博客 & 后台管理系统，和一个后端同学3月初合作的一个原生JS项目，用了一些ES6的技术模板字符串、 箭头函数、 Promise，还有一些事件委托、 Ajax等。

事业群：CSIG

一面 | 视频面试 | 90分钟

1. 你先简单做个自我介绍吧

2. 这是你自己做的吗？主要是这个管理系统是吧？

3. 是用第三方的还是完全自己手写的？

4. 用什么框架了吗？

5. 你这个项目都是静态吗？

6. 你这个文章是富文本编辑好直接放在数据库对吧？如果文章里面有不安全的标签，显示出来比较危险，你有没有做一个处理？

   > 这里我觉得可以答两点 > > 1. 过滤用户输入 > 2. markdown区域内不渲染html标签

7. 除了标签还有什么别的安全问题？

   > 我答了：XSS注入，主要是script标签。

8. 你这个没有实现登录这一套是吧？如果我要设置登录一个月的选项，如何实现这个功能？

   > 现在考虑是展示，还没有做。 > > 给cookie设置过期时间。

9. cookie和token的区别是什么？

   > 这里去了解一下。

10. 这个页面有没有用flex布局？

11. 父容器和三个子容器：ABC，B为固定宽度，AC宽度随父容器宽度变化。

    > 1. flex布局：ac设置flex1 > 2. float：abc浮动，使用calc计算宽度，中间盒子设置margin > 3. 待补充

12. 浏览器地址栏中输入网址键入回车，会有哪些事情？

13. 有个问题：你说来了script代码会停止渲染，其实，这个中间有三种方式，不一定都会停止，你了解这三种方式吗？

    > 浅谈script标签中的async和defer

    > 推荐的应用场景

    > defer: 如果你的脚本代码依赖于页面中的DOM元素（文档是否解析完毕），或者被其他脚本文件依赖。

    > **例：**评论框、代码语法高亮、polyfill.js

    > async: 如果你的脚本并不关心页面中的DOM元素（文档是否解析完毕），并且也不会产生其他脚本需要的数据。

    > **例：**百度统计

    > 如果不太能确定的话，用defer总是会比async稳定。

14. 它为什么会有这三种模式？

    > 为了让开发者自己选择，可以让页面渲染更快。

15. 渲染是如何构造出渲染树的，做了哪些工作可以说一下吗？

    > 大概说了DOM树，树的结构，然后CSS树，把css的属性合成到DOM树上，就变成渲染树，这个树上的节点有style属性，根据style属性浏览器会对它们重排（也叫回流）和重绘，根据层级关系渲染在页面上。

16. 有没有有了解过流行的框架？比如vue、react

17. 框架里面有一个diff算法，它如何去优化这个渲染的计算或者优化效率的？

    > 详解vue的diff算法，我回答成了集中读dom，集中写dom。

18. 如何尽快地定位到被改变的节点？（开放性题目）

    > diff算法的做法是：只比较同层级的节点。 > > 我回答的做法：给每个节点以数组或者哈希的形式编号，根据索引去找变化的节点，拿一些空间换时间。

19. 有没有试过，同样一个域名，同时的并发请求最多能到多少？

20. 有这些数据我们能做哪些事情？

21. 现在有一个变量，我想在一个方法里面去用它，但是我不想外面能够去改变它的值，比如第一次加载页面可以读到这个变量，但是这个变量之后不再被外面的业务逻辑去改动。我想一直访问，但是值一直是最初那个值，不受外界干扰。

    > const不行，对象内的值可以修改。函数内可以修改，但是外面无法修改到里面的值。

22. 有没有了解过Webpack打包这一块？

23. 有没有了解过页面的首屏优化？你的DEMO是如何优化的？

    > 1. 缩小图片体积，放到外链引用 > 2. 不操作dom的js就使用defer或者async > 3. 使用cdn加速js加载 > 4. 使用骨架图，类似于youtube和知乎

24. 有没有抓包过？你如何跟踪某一个特定的请求？比如一个特定的URL，你如何把有关这部分的url数据提取出来？

    > 计网实验课使用wireshark抓过包，URL、端口、IP都应该是可以通过filter过滤出来的。

25. 有多个Tab标签页，都打开腾讯视频，出了问题你如何定位哪一tab的数据？

    > 用Chrome 的开发者工具Network抓

26. 如果不是HTTP的请求报文呢？比如FTP、WebSocket，如何在抓包的时候过滤到想要的数据？

    > 没有录自己的声音，也忘了自己在说什么。。应该是根据协议或者端口过滤吧。

27. TCP如何保证数据的完整性？它有一个确认的机制，如何完成这个机制？

    > 提到了流量窗口，但是流量窗口和这个问题无关。 > > 1. 数据有可能丢失：使用超时重传。 > 2. 对数据进行编号：需要按编号接收到所有数据。 > 3. 最后对数据使用校验和

28. 对于校验和有没有更深入的理解？比如它是怎么做的？

29. 你说的滑动窗口是用于解决什么问题的？

    > 实现可靠传输（数据按序到达）、流量控制（限速）

30. TCP和UDP的区别是什么？

31. 谁的包会大一点，通常情况下？

    > 回答了tcp，因为udp不保证可靠传输，再结合它的应用场景（实时直播、会议等），它发送的包应该要小一点。 > > 下来查的：通常情况下不能保证说哪一个大或者小，因为业务场景不同。 > > TCP一个报文最长65536字节，但是一般双方会通过MSS最大报文长度限制，TCP和UDP都要通过IP层。一般又通过MTU(IP层)进行限制。

32. 设计一套聊天系统，保证聊天内容有序不丢包，然后离线的时候还要能正常收发，我是采用TCP还是UDP？

    > 这个问题要结合TCP和UDP的特点来答，哪些该用UDP？哪些该用TCP？ > > 只用TCP会不会有性能问题？

33. 算法题：二分查找2：查找指定元素的第一个和最后一个位置，给定一个按照升序排列的整数数组nums，和一个目标值target，找出给定目标值在数组中的开始位置和结束位置。

    如果数组中不存在目标值target，返回[-1, -1]

    进阶： 你可以设计并实现时间复杂度为O(log n)的算法解决此问题吗？使用迭代和非迭代实现。 > 这道题当时没跑出来，但是大致思路应该是对的，后续我有时间写一下这个题的题解（又给自己挖坑）（逃）

34. 有没有了解过http2.0？3.0呢？你觉得2.0有什么缺陷吗？1.1有什么缺陷？

35. 了解过quic吗？

    > 谷歌制定的一套基于UDP的协议。

反问

1. 您对“前端停滞了三年没有发展”怎么看？

   > 谈到了很多技术在更新，比如框架。

   是在朝统一化方向发展吗？

   >大前端flutter比较火，但是不如vue和react那么摧枯拉朽，有成本和风险在。

二面 | 视频面试 | 20分钟

1. 先做个自我介绍吧

2. 你是自己写的还是网上找的框架？

   > 使用原生JS实现

3. 博客内容也是你自己写的？

   > 是的。

4. 你这个没有路由吗？

   > 没有，只是单纯的display:show和none

5. 有没有遇到什么比较难的问题吗？

   > 讲了自己使用网上的富文本js插件。

6. 你除了列表里面的这几篇文章，还写过什么别的其他的博客吗？

   > 无

7. 看到你也去美团面试过，如果这面过了的话你会怎么选？

   > 1. 腾讯成立时间将近是美团的两倍，它平台资源也很丰富，能给我提供更好的发展机会。

   > 2. 美团的base在北京，如果可以选择的话，我更希望南下，个人意愿。

8. 现在是大三吗？可以实习多久？

9. 对TCP和UDP了解吗？比如具体的区别是什么？

10. TCP如何保证数据可达？

    > 确认收到和超时重传。 > > 它还配套了流量窗口、拥塞避免这样的协议算法。

11. 服务端收到了，回ACK包的时候客户端没收到，客户端又发了一个包，它不会重复吗？

    > 服务端拿到这个包什么也不处理，只是把之前的确认重新发送一次。

12. 那它怎么知道这个包是同一个包呢？

    > TCP有对数据进行编号，从0到4gb，我们假设某一个包中发送了10到50长度为40的数据，接收方可以比较已收到的内容 的序号和 刚刚到达的包数据的序号来判断是不是重复。

13. 你听说过黏包吗？

    > 没有。网络编程中的黏包现象

14. 有没有看过源码方面的东西？比如框架的源码之类的

    > “目前还没有看过，框架的话，我目前还只是想尽可能去熟练掌握运用的这个阶段，我觉得先把它熟练掌握再看源码是一个比较良好的过程。”

15. 上学有学过c++或者其他方面的吗？

    > 大一c++，大二java。

16. java垃圾回收机制了解吗？

    > 了解一些js的垃圾回收机制，您问的是java的吧？

    那你介绍js的吧。

    > 1. 引用计数，这种不能清除循环引用的对象。引出了标记清除 > 2. 标记清除。

然后他就不想问了，不知道是着急下班回家或者觉得：没啥问的，我都会........

这时才20分钟= =。最后也没反问，面试官给人感觉急匆匆的结束了

HR面 | 视频面试 | 20分钟

1. 先自我介绍一下好吗？

2. 你自己觉得前端吸引你的点在哪里？

3. 在学校里面，有没有什么事情是中途差点放弃的，但是最后又完成了的呢？

4. 去XX酒店实习这种工作它的挑战会很大吗？收获会很大吗？

5. 暑期去那边工作了三个月就回来了是吗？

6. 有读研的计划吗？

7. 自己在大学里面有没有碰到过什么挫折或者困难，是怎么考虑的呢？

8. 你觉得自己在前端方向上的优势是什么呢？

   > 基础好。

9. 老家是哪里的？对于工作地点是怎么考虑的呢？

   > 想去深圳。

10. 为什么想去深圳？

11. 有亲属在腾讯工作吗？

12. 除了美团的offer还有其他的吗？

13. 体检身体都是健康的吗？

14. 你在深圳工作只是实习还是想长期工作呢？因为你说过你女朋友在读书，到时毕业你们是怎么考虑的？

（HR说本周就能OC）

反问

1. 最快什么时候可以出结果？

2. 我们是哪个事业群的？

   > CSIG，后台应该能看到。

终于拿到了自己特别满足的offer，在此感谢所有帮助过我的小伙伴！（泪目）