腾讯｜前端开发实习生 | 深圳 | 一二面 + HR面面经

背景

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

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

事业群：CSIG

一面 | 视频面试 | 90分钟

你先简单做个自我介绍吧
这是你自己做的吗？主要是这个管理系统是吧？
是用第三方的还是完全自己手写的？
用什么框架了吗？
你这个项目都是静态吗？
你这个文章是富文本编辑好直接放在数据库对吧？如果文章里面有不安全的标签，显示出来比较危险，你有没有做一个处理？

> 这里我觉得可以答两点 > > 1. 过滤用户输入 > 2. markdown区域内不渲染html标签
除了标签还有什么别的安全问题？

> 我答了：XSS注入，主要是script标签。
你这个没有实现登录这一套是吧？如果我要设置登录一个月的选项，如何实现这个功能？

> 现在考虑是展示，还没有做。 > > 给cookie设置过期时间。
cookie和token的区别是什么？

> 这里去了解一下。
这个页面有没有用flex布局？
父容器和三个子容器：ABC，B为固定宽度，AC宽度随父容器宽度变化。

> 1. flex布局：ac设置flex1 > 2. float：abc浮动，使用calc计算宽度，中间盒子设置margin > 3. 待补充
浏览器地址栏中输入网址键入回车，会有哪些事情？
有个问题：你说来了script代码会停止渲染，其实，这个中间有三种方式，不一定都会停止，你了解这三种方式吗？

> 浅谈script标签中的async和defer

> 推荐的应用场景

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

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

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

> **例：**百度统计

> 如果不太能确定的话，用defer总是会比async稳定。
它为什么会有这三种模式？

> 为了让开发者自己选择，可以让页面渲染更快。
渲染是如何构造出渲染树的，做了哪些工作可以说一下吗？

> 大概说了DOM树，树的结构，然后CSS树，把css的属性合成到DOM树上，就变成渲染树，这个树上的节点有style属性，根据style属性浏览器会对它们重排（也叫回流）和重绘，根据层级关系渲染在页面上。
有没有有了解过流行的框架？比如vue、react
框架里面有一个diff算法，它如何去优化这个渲染的计算或者优化效率的？

> 详解vue的diff算法，我回答成了集中读dom，集中写dom。
如何尽快地定位到被改变的节点？（开放性题目）

> diff算法的做法是：只比较同层级的节点。 > > 我回答的做法：给每个节点以数组或者哈希的形式编号，根据索引去找变化的节点，拿一些空间换时间。
有没有试过，同样一个域名，同时的并发请求最多能到多少？
有这些数据我们能做哪些事情？
现在有一个变量，我想在一个方法里面去用它，但是我不想外面能够去改变它的值，比如第一次加载页面可以读到这个变量，但是这个变量之后不再被外面的业务逻辑去改动。我想一直访问，但是值一直是最初那个值，不受外界干扰。

> const不行，对象内的值可以修改。函数内可以修改，但是外面无法修改到里面的值。
有没有了解过Webpack打包这一块？
有没有了解过页面的首屏优化？你的DEMO是如何优化的？

> 1. 缩小图片体积，放到外链引用 > 2. 不操作dom的js就使用defer或者async > 3. 使用cdn加速js加载 > 4. 使用骨架图，类似于youtube和知乎
有没有抓包过？你如何跟踪某一个特定的请求？比如一个特定的URL，你如何把有关这部分的url数据提取出来？

> 计网实验课使用wireshark抓过包，URL、端口、IP都应该是可以通过filter过滤出来的。
有多个Tab标签页，都打开腾讯视频，出了问题你如何定位哪一tab的数据？

> 用Chrome 的开发者工具Network抓
如果不是HTTP的请求报文呢？比如FTP、WebSocket，如何在抓包的时候过滤到想要的数据？

> 没有录自己的声音，也忘了自己在说什么。。应该是根据协议或者端口过滤吧。
TCP如何保证数据的完整性？它有一个确认的机制，如何完成这个机制？

> 提到了流量窗口，但是流量窗口和这个问题无关。 > > 1. 数据有可能丢失：使用超时重传。 > 2. 对数据进行编号：需要按编号接收到所有数据。 > 3. 最后对数据使用校验和
对于校验和有没有更深入的理解？比如它是怎么做的？
你说的滑动窗口是用于解决什么问题的？

> 实现可靠传输（数据按序到达）、流量控制（限速）
TCP和UDP的区别是什么？
谁的包会大一点，通常情况下？

> 回答了tcp，因为udp不保证可靠传输，再结合它的应用场景（实时直播、会议等），它发送的包应该要小一点。 > > 下来查的：通常情况下不能保证说哪一个大或者小，因为业务场景不同。 > > TCP一个报文最长65536字节，但是一般双方会通过MSS最大报文长度限制，TCP和UDP都要通过IP层。一般又通过MTU(IP层)进行限制。
设计一套聊天系统，保证聊天内容有序不丢包，然后离线的时候还要能正常收发，我是采用TCP还是UDP？

> 这个问题要结合TCP和UDP的特点来答，哪些该用UDP？哪些该用TCP？ > > 只用TCP会不会有性能问题？
算法题：二分查找2：查找指定元素的第一个和最后一个位置，给定一个按照升序排列的整数数组nums，和一个目标值target，找出给定目标值在数组中的开始位置和结束位置。

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

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

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

反问

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

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

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

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

二面 | 视频面试 | 20分钟

先做个自我介绍吧
你是自己写的还是网上找的框架？

> 使用原生JS实现
博客内容也是你自己写的？

> 是的。
你这个没有路由吗？

> 没有，只是单纯的display:show和none
有没有遇到什么比较难的问题吗？

> 讲了自己使用网上的富文本js插件。
你除了列表里面的这几篇文章，还写过什么别的其他的博客吗？

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

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

> 2. 美团的base在北京，如果可以选择的话，我更希望南下，个人意愿。
现在是大三吗？可以实习多久？
对TCP和UDP了解吗？比如具体的区别是什么？
TCP如何保证数据可达？

> 确认收到和超时重传。 > > 它还配套了流量窗口、拥塞避免这样的协议算法。
服务端收到了，回ACK包的时候客户端没收到，客户端又发了一个包，它不会重复吗？

> 服务端拿到这个包什么也不处理，只是把之前的确认重新发送一次。
那它怎么知道这个包是同一个包呢？

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

> 没有。网络编程中的黏包现象
有没有看过源码方面的东西？比如框架的源码之类的

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

> 大一c++，大二java。
java垃圾回收机制了解吗？

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

那你介绍js的吧。

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