缓存与存储
这是问得最多的问题,通常还会问了一个之后还会问另一个。熟练掌握这两个问题。还可以引导面试官往这个方向提问。
HTTP缓存
HTTP 缓存存储与请求关联的响应,并将存储的响应复用于后续请求。
利用HTTP缓存可以减少发送请求,从而降低服务器负载,减少网络等待时间。
HTTP缓存分为强制缓存和协商缓存。
强制缓存
在 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的协商缓存实现方式是:
- 首先需要在服务器端读出文件修改时间
- 将读出来的修改时间赋给响应头的
last-modified字段。 - 最后设置
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…
浏览器存储
异步JS
promis
new Promise 构造器返回的 promise 对象具有以下内部属性:
state—— 最初是"pending",然后在resolve被调用时变为"fulfilled",或者在reject被调用时变为"rejected"。result—— 最初是undefined,然后在resolve(value)被调用时变为value,或者在reject(error)被调用时变为error。
generator
aysnc await
网络请求
跨域
XHR 与 HTTP
XMLHttpRequest 是一个内建的浏览器对象,它允许使用 JavaScript 发送 HTTP 请求。
XMLHttpRequest 有两种执行模式:同步(synchronous)和异步(asynchronous)。
使用基础
zh.javascript.info/xmlhttprequ…