安丘网站建设报价美橙智能网站
文章目录
- 浏览器强制缓存和协商缓存
- cookie，localStorage、sessionStorage
- js闭包，原型，原型链
- 箭头函数和普通函数的区别
- promise的状态扭转
浏览器强制缓存和协商缓存
浏览器缓存是浏览器用于提高网页加载速度的一种机制。浏览器缓存分为强制缓存和协商缓存。
- 强制缓存：浏览器在第一次请求资源时，会将该资源的缓存相关信息（如过期时间）保存起来。在下次请求该资源时，浏览器会先检查缓存相关信息，如果未过期，浏览器就直接从缓存中加载该资源，不需要再向服务器发送请求。常见的强制缓存策略有：Expires 和 Cache-Control。
Expires：是HTTP/1.0的标准，用于指定资源的过期时间，即到期后就需要重新请求服务器，这个时间是服务器的绝对时间，如：Expires: Wed, 21 Oct 2022 07:28:00 GMT。Cache-Control：是 HTTP/1.1 的标准，用于对缓存进行更精细化的控制。常见的取值有：- public：表示响应可以被任何缓存（包括公共缓存和私有缓存）缓存。
- private：表示响应只能被客户端（浏览器）缓存，中间的代理服务器不能缓存该响应。
- no-cache：表示浏览器在使用缓存副本之前必须先确认其有效性。
- max-age：表示资源的有效期，单位为秒。
- 协商缓存：当强制缓存失效时，浏览器会发送一个请求到服务器，服务器通过比较请求头中的一些字段来判断资源是否发生了变化。若资源未发生变化，则服务器返回 304 Not Modified 响应，浏览器继续使用缓存。若资源已经发生变化，服务器返回最新的资源，并携带新的缓存相关信息，存入缓存中。常见的协商缓存策略有：Last-Modified 和 ETag。
Last-Modified：是服务器响应的一个字段，表示资源的最后修改时间。当浏览器请求该资源时，会携带 If-Modified-Since 请求头，该头字段的值即是上次请求服务器返回的 Last-Modified 值。服务器接收到请求后，根据 If-Modified-Since 的值与资源的最后修改时间进行对比，如果时间一致，说明资源未发生变化，返回 304 Not Modified 响应。如果时间不一致，说明资源已经修改，返回最新的资源并更新 Last-Modified 值。ETag：是服务器响应的一个字段，表示资源的唯一标识。当浏览器请求该资源时，会携带 If-None-Match 请求头，该头字段的值即是上次请求服务器返回的 ETag 值。服务器接收到请求后，根据 If-None-Match 的值与资源的 ETag 进行对比，如果一致，说明资源未发生变化，返回 304 Not Modified 响应。如果不一致，说明资源已经修改，返回最新的资源并更新 ETag 值。
通过强制缓存和协商缓存两种机制的配合使用，可以在一定程度上减少对服务器的请求，提高网页加载速度。
cookie，localStorage、sessionStorage
下面是对cookie、localStorage和sessionStorage使用的表格总结：
| Cookie | localStorage | sessionStorage | |
|---|---|---|---|
| 存储容量 | 4KB | 5MB | 5MB |
| 生命周期 | 可设置过期时间 | 永久存储 | 页面关闭时清除 |
| 存储位置 | 浏览器和服务器都能读取 | 仅浏览器能读取 | 仅浏览器能读取 |
| 是否跨域访问 | 取决于Cookie的设置 | 不允许跨域访问 | 不允许跨域访问 |
| 存储数据格式 | 仅能存储字符串 | 可以存储各种数据类型 | 可以存储各种数据类型 |
| 与服务器通信 | 每次请求都会带上cookie | 不会自动带上，需要手动设置 | 不会自动带上，需要手动设置 |
js闭包，原型，原型链
闭包、原型和原型链是 JavaScript 中重要的概念。
-
闭包（Closure）：闭包是指有权访问另一个函数作用域中的变量的函数。简单来说，
闭包就是函数和声明该函数的词法环境的组合。闭包能够记住并访问其声明时的作用域，即使在函数外部被调用也可以访问到。闭包的一个常见用途是创建私有变量，它可以通过闭包隐藏内部状态，只暴露一些公共接口。 -
原型（Prototype）：在 JavaScript 中，每个对象都有一个原型。
原型是一个对象，其他对象可以通过它来继承属性和方法。当你访问一个对象的属性或方法时，如果这个对象本身没有这个属性或方法，JavaScript 引擎会去它的原型上查找，如果原型上也没有，就会继续查找原型的原型，直到找到或者到达原型链的末尾。 -
原型链（Prototype Chain）：原型链是由对象的原型组成的链式结构。
当一个对象在查找属性或方法时，如果自身没有，它会通过原型链向上查找，直到找到或者到达原型链的末尾（Object.prototype）。原型链是 JavaScript 实现继承的机制之一，可以让对象共享原型的属性和方法。
这些概念相互关联并且在 JavaScript 中非常重要。深入了解它们将有助于更好地理解和使用 JavaScript。
箭头函数和普通函数的区别
箭头函数和普通函数在语法和功能方面有一些区别：
-
语法：箭头函数使用箭头（=>）来定义函数，而普通函数使用 function 关键字来定义函数。
-
this 绑定：箭头函数没有自己的 this 绑定，它会捕获所在上下文的 this 值，可以理解为箭头函数的 this 值是词法上下文的绑定。而普通函数的 this 值是在运行时动态绑定的。
-
arguments对象：箭头函数没有自己的 arguments 对象，但它可以访问外部作用域中的 arguments 对象。普通函数可以直接访问自己的 arguments 对象。 -
构造函数：箭头函数不能用作构造函数，因为箭头函数没有自己的 this 值，无法使用 new 关键字来创建对象。而普通函数可以用作构造函数来创建对象。
-
返回值：箭头函数的返回值会直接作为函数的返回值，不需要使用 return 关键字。普通函数需要使用 return 关键字来指定返回值。
综上所述，箭头函数适用于一些简单的函数，尤其是需要更简洁的语法和避免 this 绑定问题的场景。而普通函数则更灵活，可以适应更多的场景，并支持更多的语法特性。
promise的状态扭转
Promise 的状态扭转包括三种状态：Pending（进行中）、Fulfilled（已成功）和Rejected（已失败）。
初始状态为 Pending（进行中），表示 Promise 的操作还未完成。
当 Promise 的操作成功完成时，状态会从 Pending（进行中）转变为 Fulfilled（已成功），并且会调用 Promise 的 resolve 函数。
当 Promise 的操作失败时，状态会从 Pending（进行中）转变为 Rejected（已失败），并且会调用 Promise 的 reject 函数。
一旦状态从 Pending（进行中）转变为 Fulfilled（已成功）或 Rejected（已失败），就不会再次发生状态转换。
在状态转换后，可以通过 then 方法来处理 Promise 的结果。如果状态为 Fulfilled（已成功），则会执行第一个参数传入的回调函数；如果状态为 Rejected（已失败），则会执行第二个参数传入的回调函数。
需要注意的是，Promise 的状态是不可逆的，一旦状态发生了改变，就无法再次改变。所以，Promise 的状态转换只会发生一次。