JavaScript 的本地存储的方式有哪些？

cookie

定义：

cookie是服务器发送给浏览器的一小段信息，浏览器会保存起来，一般用于辨别用户身份。

特点：

• 单个cookie大小不能超过4KB
• 除非设置过期时间，否则关闭浏览器后cookie就会消失

使用场景：

• 用于身份验证

sessionStorage

定义：

sessionStorage用于本地存储一个会话中的数据，只有同一个会话中的页面才能访问，会话结束，数据才会清除。

特点：

• 存储大小比cookie大，和localStorage差不多
• 仅在当前会话中有效，会话结束，数据就会清除
• 数据不会发送到浏览器，相对来说比cookie安全

使用场景：

• 用户当前操作需要保存的数据，例如用户将商品添加到购物车，然后前往结算页面对购物车中的商品进行付款

localStorage

定义：

localStorage用于本地永久性地存储数据，除非主动清除，否则数据不会丢失

特点：

• 存储大小比cookie大，和sessionStorage差不多
• 除非主动清除，否则数据不会丢失
• 支持在同一域名下跨窗口访问数据

使用场景：

• 用户的偏好设置

三者的区别

• 存储大小：sessionStorage和localStorage的存储容量都大于cookie
• 生命周期：cookie可以设置过期时间；sessionStorage在当前会话结束后就会清除数据；localStorage除非主动删除，否则数据不会丢失
• 安全性：cookie可以跟随请求发送到浏览器，存在被劫持的可能性；而sessionStorage和localStorage的数据不会跟随请求发送到浏览器，相对比较安全