整理与总结前端极高频面试题

116 阅读3分钟

缓存与存储

这是问得最多的问题,通常还会问了一个之后还会问另一个。熟练掌握这两个问题。还可以引导面试官往这个方向提问。

HTTP缓存

HTTP 缓存存储与请求关联的响应,并将存储的响应复用于后续请求。

利用HTTP缓存可以减少发送请求,从而降低服务器负载,减少网络等待时间。 HTTP缓存分为强制缓存协商缓存。 image.png

强制缓存

在 HTTP/1.0 中,新鲜度过去由 Expires 标头指定。
HTTP/1.1 中,Cache-Control 采用了 max-age——用于指定经过的时间。

Expires: Tue, 28 Feb 2022 22:22:22 GMT
Cache-Control: max-age=<seconds>
Cache-Control: no-cache   // 禁用强制缓存
Cache-Control: no-store   // 禁用所有缓存
Cache-Control: public/private   // 是否能被代理服务器缓存

max-age优先级大于expires

协商缓存

基于last-modified的协商缓存实现方式是:

  1. 首先需要在服务器端读出文件修改时间
  2. 将读出来的修改时间赋给响应头的last-modified字段。
  3. 最后设置Cache-control:no-cache

客户端读取到last-modified的时候,会在下次的请求标头中携带一个字段:If-Modified-Since。服务器以此来决定是使用缓存(返回304状态码)还是返回新的资源。

存在的问题:时间误差(两次修改的时间在非常短的时间)和内容误差(多次修改回到初始内容导致缓存失效)

使用Etag字段 1.第一次请求某资源的时候,服务端读取文件并计算出文件指纹,将文件指纹放在响应头的etag字段中跟资源一起返回给客户端。

2.第二次请求某资源的时候,客户端自动从缓存中读取出上一次服务端返回的ETag也就是文件指纹。并赋给请求头的if-None-Match字段,让上一次的文件指纹跟随请求一起回到服务端。

3.服务端拿到请求头中的is-None-Match字段值(也就是上一次的文件指纹),并再次读取目标资源并生成文件指纹,两个指纹做对比。如果两个文件指纹完全吻合,说明文件没有被改变,则直接返回304状态码和一个空的响应体并return。如果两个文件指纹不吻合,则说明文件被更改,那么将新的文件指纹重新存储到响应头的ETag中并返回给客户端。 参考:juejin.cn/post/712719…

浏览器存储

juejin.cn/post/713718…

异步JS

promis

new Promise 构造器返回的 promise 对象具有以下内部属性:

  • state —— 最初是 "pending",然后在 resolve 被调用时变为 "fulfilled",或者在 reject 被调用时变为 "rejected"
  • result —— 最初是 undefined,然后在 resolve(value) 被调用时变为 value,或者在 reject(error) 被调用时变为 error

generator

aysnc await

网络请求

跨域

juejin.cn/post/684490…

XHR 与 HTTP

XMLHttpRequest 是一个内建的浏览器对象,它允许使用 JavaScript 发送 HTTP 请求。 XMLHttpRequest 有两种执行模式:同步(synchronous)和异步(asynchronous)。
使用基础
zh.javascript.info/xmlhttprequ…

ajax

fetch

axios

三者的区别

JS核心

深拷贝

this指向

闭包