前端菜鸟的第一次面试记录和总结--字节跳动前端开发岗

我直接原地吓哭。

本人，零基础野生百度出身前端小白一个。
面试官，一个看起来就很大佬的小姐姐。
谨以此文记录人生第一次面试经历。
其实本来学校里学的课程就没什么和前端相关的，可是本人对后端又没那么大兴趣，初生牛犊不怕虎，想都没想投了前端岗，一看面经直接吓哭，这都什么题目？？？什么？什么请求？什么react？什么vue？？

好在不知道是实习生要求没那么高还是面试官看出来我菜，问的问题都没有我之前写的文章里那么硬核，话不多说上干货。

part1：专业知识

CS的朋（tu）友（tou）们应该都学过那些个知识点居多还杂的硬核课程，计组计网数据结构，这几门课考研实习都很重要。

Q1：说下TCP和UDP

上上学期学的内容啊！！啥来着，满脑子只记得一个面向连接一个无连接。
我的回答：很乱，想不起来了，说的不是很完整。
标准答案：

1. UDP协议全称是用户数据报协议，在网络中它与TCP协议一样用于处理数据包，是一种无连接的协议。在OSI模型中，在第四层——传输层，处于IP协议的上一层。UDP有不提供数据包分组、组装和不能对数据包进行排序的缺点，也就是说，当报文发送之后，是无法得知其是否安全完整到达的。特点：无连接、单播多播广播功能、面向报文、不可靠。
2. TCP协议全称是传输控制协议是一种面向连接的、可靠的、基于字节流的传输层通信协议，由 IETF 的RFC 793定义。TCP 是面向连接的、可靠的流协议。流就是指不间断的数据结构，你可以把它想象成排水管中的水流。特点：面向连接、面向字节流、只支持单播、可靠传输、拥塞控制、支持全双工通信。

Q2：三次握手四次挥手

额，只记得TCP有这东西，细节全是乱的。
我的回答：没说错也不完整
标准答案：

1. TCP建立连接时：

• 第一次握手
  客户端向服务端发送连接请求报文段。该报文段中包含自身的数据通讯初始序号。请求发送后，客户端便进入 SYN-SENT 状态。
• 第二次握手
  服务端收到连接请求报文段后，如果同意连接，则会发送一个应答，该应答中也会包含自身的数据通讯初始序号，发送完成后便进入 SYN-RECEIVED 状态。
• 第三次握手
  当客户端收到连接同意的应答后，还要向服务端发送一个确认报文。客户端发完这个报文段后便进入 ESTABLISHED 状态，服务端收到这个应答后也进入 ESTABLISHED 状态，此时连接建立成功。
• 为什么 TCP 建立连接需要三次握手，而不是两次？这是因为这是为了防止出现失效的连接请求报文段被服务端接收的情况，从而产生错误。

2. TCP断开连接时：

• 第一次挥手
  若客户端 A 认为数据发送完成，则它需要向服务端 B 发送连接释放请求。
• 第二次挥手
  B 收到连接释放请求后，会告诉应用层要释放 TCP 链接。然后会发送 ACK 包，并进入 CLOSE_WAIT 状态，此时表明 A 到 B 的连接已经释放，不再接收 A 发的数据了。但是因为 TCP 连接是双向的，所以 B 仍旧可以发送数据给 A。
• 第三次挥手
  B 如果此时还有没发完的数据会继续发送，完毕后会向 A 发送连接释放请求，然后 B 便进入 LAST-ACK 状态。
• 第四次挥手
  A 收到释放请求后，向 B 发送确认应答，此时 A 进入 TIME-WAIT 状态。该状态会持续 2MSL（最大段生存期，指报文段在网络中生存的时间，超时会被抛弃） 时间，若该时间段内没有 B 的重发请求的话，就进入 CLOSED 状态。当 B 收到确认应答后，也便进入 CLOSED 状态。

Q3：TCP和UDP的应用

我的回答：差不多答上来几个
标准答案：

• TCP面向字节流（效率要求不高，准确性要求高）：文件传输（准确高要求高、但是速度可以相对慢）、接受邮件、远程登录。
• UDP面向报文（准确性要求不高，效率要求高）：QQ聊天、在线视频、网络语音电话（即时通讯，速度要求高，但是出现偶尔断续不是太大问题，并且此处完全不可以使用重发机制）、广播通信（广播、多播）。

Q4：进程和线程

我的回答：说反了好像（微笑）
标准答案：

• 进程是资源（CPU、内存等）分配的基本单位，它是程序执行时的一个实例。程序运行时系统就会创建一个进程，并为它分配资源，然后把该进程放入进程就绪队列，进程调度器选中它的时候就会为它分配CPU时间，程序开始真正运行。
• 线程是程序执行时的最小单位，它是进程的一个执行流，是CPU调度和分派的基本单位，一个进程可以由很多个线程组成，线程间共享进程的所有资源，每个线程有自己的堆栈和局部变量。线程由CPU独立调度执行，在多CPU环境下就允许多个线程同时运行。同样多线程也可以实现并发操作，每个请求分配一个线程来处理。
• 进程是资源分配的最小单位，线程是程序执行的最小单位
• 进程有自己的独立地址空间，每启动一个进程，系统就会为它分配地址空间，建立数据表来维护代码段、堆栈段和数据段，这种操作非常昂贵。而线程是共享进程中的数据的，使用相同的地址空间，因此CPU切换一个线程的花费远比进程要小很多，同时创建一个线程的开销也比进程要小很多。
• 线程之间的通信更方便，同一进程下的线程共享全局变量、静态变量等数据，而进程之间的通信需要以通信的方式（IPC)进行。不过如何处理好同步与互斥是编写多线程程序的难点。
• 多进程程序更健壮，多线程程序只要有一个线程死掉，整个进程也死掉了，而一个进程死掉并不会对另外一个进程造成影响，因为进程有自己独立的地址空间。

part2：前端知识

到这一块我彻底慌了，完全野蛮百度出身的我的前端知识呵呵呵呵。。

Q1：http请求方法有哪些

我的回答：（完了没学过啊啥啊算了瞎编吧）跨域请求JSONP（。。。）
标准答案：GET方法、POST方法、HEAD方法、PUT方法、DELETE方法、CONNECT方法、OPTIONS方法、TRACE方法（其实我知道这些东西，但我不知道这些是这一题的答案啊！）

Q2：盒模型以及对应的css属性

我的回答：从外到内是：外边距(margin)、边框(border)、内填充(padding)、标签中内容(content)。css没学过不知道
标准答案：
Margin(外边距) - 清除边框外的区域，外边距是透明的。
Border(边框) - 围绕在内边距和内容外的边框。
Padding(内边距) - 清除内容周围的区域，内边距是透明的。
Content(内容) - 盒子的内容，显示文本和图像。
图片来源https://www.cnblogs.com/liyihua/p/12369889.html

Q3：前端的存储方式

我的回答：做过微信小程序，用的wxStorage，本地存储方式，大小最多10M我记得，对于HTML应该是有cookie，本地存储localStorage。
标准答案：

• h5之前，存储主要是用cookies。cookies缺点有在请求头上带着数据，大小是4k之内。主Domain污染。
• localStorage 没有时间限制的数据存储
• sessionStorage 针对一个 session 的数据存储
• indexedDB 对象仓库
  详情https://www.jianshu.com/p/e7c4b1c72c7b

追问：没有实际用过这两种方式是吗

答：小程序的wxml和html关联很大差别不大，都是本地存储，即使没用过应该也是差不多的。

Q4： es6

我的回答：之前面向对象时，类和构造函数一样的，其他的没了解过
标准答案：

• ES6， 全称 ECMAScript 6.0 ，是 JavaScript 的下一个版本标准，2015.06 发版
• ES6 主要是为了解决 ES5 的先天不足，比如 JavaScript 里并没有类的概念，但是目前浏览器的 JavaScript 是 ES5 版本，大多数高版本的浏览器也支持 ES6，不过只实现了 ES6 的部分特性和功能。

Q5：跨域请求

我的回答：只要协议、域名、端口有任何一个不同，都被当作是不同的域。有跨域请求是因为浏览器的同源策略，所谓同源就是协议域名端口都一样的请求。方法很多，除了JSONP其他的方法还有CORS方法、跨文本消息传递、nodejs等等。
标准答案：通过jsonp跨域、document.domain + iframe跨域、location.hash + iframe、window.name + iframe跨域、postMessage跨域、跨域资源共享（CORS）、nginx代理跨域、nodejs中间件代理跨域、WebSocket协议跨域

追问：JSONP是现在常用的方法吗

我的回答：应该不是，因为JSONP只支持GET方法的请求，但是jsonp的优点就是很多浏览器都支持它。CORS 方法应该比较常用，因为现在大部分浏览器都支持，且它支持所有请求方法。
标准答案：https://blog.csdn.net/qq_36140085/article/details/81606508

再追问：知道CORS的原理吗

我的回答：除了jsonp都没了解过
标准答案：https://blog.csdn.net/badmoonc/article/details/82706246

再再追问：刚刚说的跨文本消息传递了解过吗

我的回答：没有
标准答案：https://blog.csdn.net/zywpurple/article/details/53079857

part3：代码考察

Q1：js写个数组排序

我用的快排，然后让讲解一下，因为是上学期刚考完的算法设计内容，还算蛮简单。

Q2：js写个发布订阅模式

我：完全没什么头绪，先写个类再说，后来语法不太清楚了（平时都是啥语法不知道就百度，看来系统的学习还是非常有必要的）
然后我写了个event事件类，写了add添加方法，写了remove解除订阅方法
面试官说：不然你讲一下思路吧
我：我感觉还得加个错误处理，我这里语法不太熟练不知道咋写了
面试官：在哪加错误处理
我：（思考良久）这吧，加个错误事件的处理。我感觉还得加个方法
面试官：你是说现在你写了添加和删除，还需要发布的方法是吗
我：（哇原来如此）是的。

结束面试

我真的心惊胆战，刺激的一场视频面试就结束了，lay了，后续想起来啥再加吧。