2024年最新【前端面试】计算机网络与前端(1)，一篇文章教你搞定计算机网络面试

最新推荐文章于 2024-11-01 10:18:14 发布

2401_84619245

最新推荐文章于 2024-11-01 10:18:14 发布

阅读量861

点赞数 11

分类专栏：程序员文章标签：前端面试学习

本文链接：https://blog.csdn.net/2401_84619245/article/details/138884554

版权

程序员专栏收录该内容

98 篇文章 0 订阅

订阅专栏

这里分享一份由字节前端面试官整理的「2021大厂前端面试手册」，内容囊括Html、CSS、Javascript、Vue、HTTP、浏览器面试题、数据结构与算法。全部整理在下方文档中，共计111道

HTML

HTML5有哪些新特性？
Doctype作⽤? 严格模式与混杂模式如何区分？它们有何意义?
如何实现浏览器内多个标签页之间的通信？
⾏内元素有哪些？块级元素有哪些？空(void)元素有那些？⾏内元素和块级元素有什么区别？
简述⼀下src与href的区别？
cookies,sessionStorage,localStorage 的区别？
HTML5 的离线储存的使用和原理？
怎样处理移动端 1px 被渲染成 2px 问题？
iframe 的优缺点？
Canvas 和 SVG 图形的区别是什么？

JavaScript

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

问：0.1 + 0.2 === 0.3 嘛？为什么？
JS 数据类型
写代码：实现函数能够深度克隆基本类型
事件流
事件是如何实现的？
new 一个函数发生了什么
什么是作用域？
JS 隐式转换，显示转换
了解 this 嘛，bind，call，apply 具体指什么
手写 bind、apply、call
setTimeout(fn, 0)多久才执行，Event Loop
手写题：Promise 原理
说一下原型链和原型链的继承吧
数组能够调用的函数有那些？
PWA使用过吗？serviceWorker的使用原理是啥？
ES6 之前使用 prototype 实现继承
箭头函数和普通函数有啥区别？箭头函数能当构造函数吗？
事件循环机制（Event Loop）

路由选择协议，：确定数据报在源与目的地之间采用的路径

HTPP请求

======

HTTP（HyperText Transfer Protocol，超文本传输协议），即计算机通过网络通信的规则。HTTP通信机制是在一次完整的HTTP通信过程中，Web浏览器与Web服务器之间将完成下列7个步骤：

建立TCP连接

在HTTP工作开始之前，Web浏览器首先要通过网络与Web服务器建立TCP连接，该协议与IP协议共同构建Internet，即著名的TCP/IP协议族，因此Internet又被称作TCP/IP网络。

HTTP是比TCP更高层次的应用层协议，根据规则，低层协议建立之后才能进行更层协议的连接，因此，首先要建立TCP连接

一般TCP连接的端口号是80

Web浏览器向Web服务器发送请求命令

一旦建立了TCP连接，Web浏览器就会向Web服务器发送请求命令

例如：GET/sample/hello.jsp HTTP/1.1

Web浏览器发送请求头信息

浏览器发送其请求命令之后，还要以头信息的形式向Web服务器发送一些别的信息，之后浏览器发送了一空白行来通知服务器，它已经结束了该头信息的发送。

Web服务器应答

客户机向服务器发出请求后，服务器会向客户机回送应答，

HTTP/1.1 200 OK

应答的第一部分是协议的版本号和应答状态码

Web服务器发送应答头信息

服务器随同应答向用户发送关于它自己的数据及被请求的文档。

Web服务器向浏览器发送数据

以Content-Type应答头信息所描述的格式发送用户所请求的实际数据

Web服务器关闭TCP连接

一般情况下，一旦Web服务器向浏览器发送了请求数据，它就要关闭TCP连接，然后如果浏览器或者服务器在其头信息加入了这行代码

Connection:keep-alive

TCP连接在发送后将仍然保持打开状态，于是，浏览器可以继续通过相同的连接发送请求。

保持连接节省了为每个请求建立新连接所需的时间，还节约了网络带宽。

======

HTTP Cookie（也叫Web cookie或者浏览器Cookie）是服务器发送到用户浏览器并保存在浏览器上的一块数据，它会在浏览器下一次发起请求时被携带并发送到服务器上。比较经典的，可以它用来确定两次请求是否来自于同一个浏览器，从而能够确认和保持用户的登录状态。Cookie的使用使得基于无状态的HTTP协议上记录稳定的状态信息成为了可能。
cookie的属性
key-value：cookie通过key-value的方式存储属性名和值。
domain：规定了需要发送Cookie的主机名。如果没有指定，默认为当前的文档地址上的主机名（但是不包含子域名）。如果指定了Domain，则一般包含子域名。
path:Path指令表明需要发送Cookie的URL路径。字符%x2F (即”/”)用做文件夹分隔符，子文件夹也会被匹配到。
hostOnly：布尔型的值，true表示cookie只能匹配domain中指定好的请求路径。反之则不。
httpOnly：HTTP-only类型的Cookie不能使用Javascript通过Document.cookie

属性来访问，从而能够在一定程度上阻止跨域脚本攻击（XSS）。

secure：布尔型的值，true表示cookie只在安全的情况下有效。一般是在https情况下。即在使用SLL和HTTPS协议向服务器发起请求时，才能确保Cookie被安全地发送到服务器。
expirationDate：指明cookie的过期的时间。
Max-Age：指明cookie的有效期。
session：布尔值，true表示cookie是session cookie。false的话表示持续的cookie且不过期。
storeId：代表存放cookie的id的字符串。

HTTP与HTTPS

总结

我在成长过程中也是一路摸爬滚打，没有任何人的指点，所以走的很艰难。例如在大三的时候，如果有个学长可以阶段性的指点一二，如果有已经工作的师兄可以告诉我工作上需要什么，我应该前面的三年可以缩短一半；后来去面试bat，失败了有5、6次，每次也不知道具体是什么原因，都是靠面试回忆去猜测可能是哪方面的问题，回来学习和完善，当你真正去招人的时候，你就会知道面试记录是多么重要，面试官可以从面试记录里看到你的成长，总是去面试，总是没有成长，就会被定义为缺乏潜力。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】