在腾讯前端面试篇（一）中，我主要讲了笔者面试腾讯一面和二面的经历，文章得到了不错的反响，笔者一激动大晚上把女朋友晾在一边，写下了第二篇，现在耳朵和膝盖都还有点痛。第二篇会讲述笔者面试腾讯的第三面，第四面会在后续的文章更新。大家看我辛苦的份上，关注一下呗！
第三面——电话面加远程机试
这一面问的问题不多，问了一下网络相关的问题，还问了几个智力题，其他都为机试！
来来来，废话不说，干货搞起来！
1. 从输入URL到页面加载发生了什么？
这个问题有没有觉得很眼熟，相信很多人在面试中都遇到过，这是一道非常非常经典的面试题！面试官喜欢问，是因为这道题真的可以考察很多方面的知识。
答案：
1、浏览器的地址栏输入URL并按下回车。
2、浏览器查找当前URL是否存在缓存，并比较缓存是否过期。
3、DNS解析URL对应的IP。
4、根据IP建立TCP连接（三次握手）。
5、HTTP发起请求。
6、服务器处理请求，浏览器接收HTTP响应。
7、渲染页面，构建DOM树。
8、关闭TCP连接（四次挥手）。
1.1 刚刚你说到过缓存，说一下缓存相关的知识吧？
答案：
浏览器缓存,HTTP缓存有多种规则，根据是否需要重新向服务器发起请求来分类，我将其分为强制缓存，对比缓存（协商缓存）。
强制缓存判断HTTP首部字段：cache-control，Expires。
Expires是一个绝对时间，即服务器时间。浏览器检查当前时间，如果还没到失效时间就直接使用缓存文件。但是该方法存在一个问题：服务器时间与客户端时间可能不一致。因此该字段已经很少使用。
cache-control中的max-age保存一个相对时间。例如Cache-Control: max-age = 484200，表示浏览器收到文件后，缓存在484200s内均有效。如果同时存在cache-control和Expires，浏览器总是优先使用cache-control。
对比缓存通过HTTP的last-modified，Etag字段进行判断。
last-modified是第一次请求资源时，服务器返回的字段，表示最后一次更新的时间。下一次浏览器请求资源时就发送if-modified-since字段。服务器用本地Last-modified时间与if-modified-since时间比较，如果不一致则认为缓存已过期并返回新资源给浏览器；如果时间一致则发送304状态码，让浏览器继续使用缓存。
Etag：资源的实体标识（哈希字符串），当资源内容更新时，Etag会改变。服务器会判断Etag是否发生变化，如果变化则返回新资源，否则返回304。
如果还有疑问，也可以查看黑金团队的一篇关于缓存的文章，讲的非常透彻，前端缓存最佳实践 。
1.2 请描述一下DNS解析的具体过程？
DNS解析是一个递归查询的过程，三言两语无法阐述清楚，大家看图吧。
1.3 TCP是如何发起连接和关闭连接的？
答案： 这个So easy!三次握手，四次挥手呗！
1.4 你知道哪些状态码？
1xx：指示信息–表示请求已接收，继续处理。
2xx：成功–表示请求已被成功接收、理解、接受。
3xx：重定向–要完成请求必须进行更进一步的操作。
4xx：客户端错误–请求有语法错误或请求无法实现。
5xx：服务器端错误–服务器未能实现合法的请求。 平时遇到比较常见的状态码有:200, 204, 301, 302, 304, 400, 401, 403, 404, 422, 500(分别表示什么请自行查找)。
1.5 刚刚你说的整个过程中，有哪些优化手段可以优化提高网页响应速度？
分享一篇非常全面的优化的文章
2. 5点15分，时钟和分钟的夹角？
67.5度哈，这个是有个公式的，自己推理一波，如果不清楚可以在评论区问我。
3. 8个外表一样的小球 其中7个球重量相同 1个球为[异常球] 可能重量比较重也可能比较轻 利用天平称重至少多少次可以确保找出这个[异常球]，并需要知道到底是轻了还是重了。
这是一道非常有意思的题，答案为3次。
答案
一、将8个球先取四个组成A、B两组，每组2个。
二、、将A、B组进行第一次称，若不同重则有一组有问题。
三、将重组两个球第二次称，若不同重则有一个有问题。 将重组重球（若选轻球则以下结论相反）与轻组一球进行第三次称。 若球重，则这粒为重球为异常球；若相同，则剩余那个为轻异常球。
面试结束了，😁，咱们进入笔试环节
一. 用原生js实现，要求：不能搜索网上资源，做到组件化，时间100 min。
1. 实现一个div滑动的动画，由快至慢5s结束（不准用css3)。
2. 页面内有一个input输入框，实现在数组arr查询命中词并要求autocomplete效果。
题目非常简单，但是非常考验面试者的代码实现能力、设计能力，功能实现基本谁都能做到。
实话实说，笔者这道题实现的有点挫，但架不住我长得可爱😊呢！所以面试官审阅了代码后，又给了我一次机会，你再做一题吧，这两题答案我不太满意！
二. 实现超出整数存储范围的两个大整数相加function add(a,b)。注意a和b以及函数的返回值都是字符串。
这道题笔者倒是轻松的完成了，直接上代码。
function add (a, b) {
let lenA = a.length,
lenB = b.length,
len = lenA > lenB ? lenA : lenB;
// 先补齐位数一致
if(lenA > lenB) {
for(let i = 0; i < lenA - lenB; i++) {
b = '0' + b;
}
} else {
for(let i = 0; i < lenB - lenA; i++) {
a = '0' + a;
}
}
let arrA = a.split('').reverse(),
arrB = b.split('').reverse(),
arr = [],
carryAdd = 0;
for(let i = 0; i < len; i++) {
let temp = Number(arrA[i]) + Number(arrB[i]) + carryAdd;
arr[i] = temp > 9 ? temp - 10 : temp;
carryAdd = temp >= 10 ? 1 : 0;
}
if(carryAdd === 1) {
arr[len] = 1;
}
return arr.reverse().join('');
}
结语
三面就这样愉快的结束了，笔者可以开开心心给女朋友煮水饺喽！祝大家冬至快乐！
@author: Even
