珠海特价做网站,太原网站优化技术,简述电子商务网站开发的基本流程,免费ppt课件模板大全文章目录 浏览器强制缓存和协商缓存cookie#xff0c;localStorage、sessionStoragejs闭包#xff0c;原型#xff0c;原型链箭头函数和普通函数的区别promise的状态扭转 浏览器强制缓存和协商缓存
浏览器缓存是浏览器用于提高网页加载速度的一种机制。浏览器缓存分为强制缓… 文章目录 浏览器强制缓存和协商缓存cookielocalStorage、sessionStoragejs闭包原型原型链箭头函数和普通函数的区别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 值。
通过强制缓存和协商缓存两种机制的配合使用可以在一定程度上减少对服务器的请求提高网页加载速度。
cookielocalStorage、sessionStorage
下面是对cookie、localStorage和sessionStorage使用的表格总结
CookielocalStoragesessionStorage存储容量4KB5MB5MB生命周期可设置过期时间永久存储页面关闭时清除存储位置浏览器和服务器都能读取仅浏览器能读取仅浏览器能读取是否跨域访问取决于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 的状态转换只会发生一次。
