JavaScript本地存储
JavaScript本地存储主要分为三类：localStorage， sessionStorage，以及复杂数据类型的存储。localStorage：用途：用于持久存储数据，数据在页面刷新或浏览器关闭后仍然保留。存储数据：使用localStorage.setItem方法存储数据。如果键不存在，会新建并存储值；若键已存在，则更新其内容。
JavaScript本地存储主要包括cookie、localStorage、sessionStorage和indexedDB，各自特点和应用场景如下：cookie：特点：作为小型文本文件，最初设计并非为缓存，但常用于标识用户并保持登录状态。易于获取，但安全性较低。
JavaScript提供了多种本地存储方式，以满足不同场景下的数据存储需求。以下是四种主要的本地存储方式及其详细解析：Cookie 类型与定义：Cookie是小型文本文件，存储在用户本地终端上，用于辨别用户身份。它并非专为缓存设计，但常被用于此目的。
在登录注册页面中，我们利用了本地存储的概念来实现功能。本地存储的特性在于数据存储在用户浏览器中，设置和读取都很方便，页面刷新也不会丢失数据。它分为两种存储方式：sessionStorage和localStorage。sessionStorage的特点是存储的数据仅在当前窗口（页面）中有效，关闭浏览器窗口后数据会被清除。
前端缓存的几种方式
1、前端缓存是提高网页加载速度和用户体验的重要手段。以下是前端缓存的几种主要方式：Cookie 描述：Cookie 是一种小型文本文件，存储在用户的计算机上，由服务器发送并在之后的请求中自动携带回服务器。特点：自动携带：Cookie 数据始终在同源的 HTTP 请求中携带，即使不需要也会发送。
2、强缓存 定义：强缓存是指浏览器在本地存储中直接使用缓存数据，而无需再次向服务器请求。 作用：当资源被缓存后，再次访问网站时，大多数资源都会从本地缓存中获取，从而大大提高加载速度。 设置：通过请求头和响应头中的首部字段进行设置，如CacheControl和Expires。
3、HTTP缓存 HTTP缓存是一种优化性能的技术，通过请求和响应头中的Header信息管理资源的存储和重复利用。它有助于缩短请求距离，减少延迟，节省流量，降低网络负荷，提升客户端响应效率。缓存类型 强缓存：资源命中时，客户端直接从本地缓存读取，返回HTTP状态码200。
4、除了强缓存和协商缓存，还有一种启发式缓存。当响应头中不存在用于确定强缓存时间的字段时，浏览器会触发启发式缓存。缓存有效期计算公式为：（date - last-modified） * 10%。这种缓存方式虽然容易忽略，但了解其机制可以帮助我们更好地优化网站性能。总结来说，HTTP缓存是一个复杂但重要的概念。
cookie、sessionStorage、localStorage的区别
1、存储的大小不同cookie：cookie的存储量较小，通常每个cookie的存储容量大约是4KB左右。一个网站在用户的浏览器中最多只能存储大约20条cookie信息（不同浏览器可能有所不同）。
2、cookie、sessionStorage、localStorage的区别如下：有效期：cookie：默认会在浏览器关闭后过期，但也可以通过设置过期时间来延长其生命周期。sessionStorage：数据在页面会话结束时过期，即页面关闭后数据被清除。localStorage：数据会持久化存储，直到被手动清除，没有过期时间。
3、Cookie、Session、localStorage、sessionStorage的区别如下：Cookie：存储位置：存储在用户的浏览器中。用途：通过识别Cookie，服务器能够追踪用户的会话。会话Cookie主要用于短期存储，持久Cookie用于跨会话保存信息。安全性：相对较低，可能面临欺骗和截获的威胁，且跨域性有限。
cookie、localStorage、sessionStorage详解
1、Cookie、LocalStorage、sessionStorage的详解如下： Cookie 定义：Cookie是一种小型文本信息，存储在客户端，以键值对的形式工作。 操作方式：通过document.cookie进行操作。 生命周期：具有特定的生命周期，可以指定过期时间。
2、即使关闭当前会话页或整个浏览器，localStorage中的数据也不会丢失。 存储的大小不同cookie：cookie的存储量较小，通常每个cookie的存储容量大约是4KB左右。一个网站在用户的浏览器中最多只能存储大约20条cookie信息（不同浏览器可能有所不同）。
3、localStorage：是HTML5 Web Storage API的一部分，用于在客户端本地永久存储数据，即使浏览器关闭，数据也不会消失。sessionStorage：同样是HTML5 Web Storage API的一部分，但它用于临时存储数据，仅在浏览器会话期间有效，关闭浏览器后数据会被清除。详细区别 保存方式 Cookie：保存在客户端浏览器端。
4、Cookie、Session、localStorage、sessionStorage的区别如下：Cookie：存储位置：存储在用户的浏览器中。用途：通过识别Cookie，服务器能够追踪用户的会话。会话Cookie主要用于短期存储，持久Cookie用于跨会话保存信息。安全性：相对较低，可能面临欺骗和截获的威胁，且跨域性有限。
本地缓存/cookie、sessionStorage、localStorage的区别
存储的时间有效期不同cookie：cookie的有效期是可以进行设置的。它能够跨页面存储数据，在默认设置下（没有指定过期时间），cookie会存储在内存中，浏览器关闭后自动消失。但如果设置了过期时间，cookie则会存储在硬盘上，即使关闭浏览器，cookie数据依然存在，直到过期时间到达或用户手动删除。
数据有效期不同，sessionStorage仅仅在当前浏览器窗口关闭之前有效；localStorage始终有效，窗口或 者浏览器关闭之后也一直保存，因此作用持久数据；cookie，只在设置cookie过期时间之前有效，即使 窗口关闭或者浏览器关闭。
总结：Cookie适合轻量级、短期存储；Session适合会话跟踪，数据存储在服务器端，安全性更高；localStorage和sessionStorage则提供了更大的存储空间和更快的本地访问速度，但安全性仍有局限。选择哪种存储方式取决于具体需求，如数据持久性、敏感性、性能和安全性。
前端面试题——三种本地存储策略的区别
1、前端开发中，本地存储是存储临时或持久数据的关键手段，用于优化用户体验，减少不必要的服务器请求。常见的三种本地存储策略各有特点： Cookie Cookie是早期的主要存储方式，但有4k的存储限制，且数据以字符串形式存在，使用不便。
2、栈（stack）和堆（heap）是前端编程中的两个核心概念，它们在内存管理中扮演着重要角色。栈内存是自动分配的、固定大小的内存区域，遵循FILO（先进后出）原则，类似于乒乓球盒，先放进去的最后被取出。栈内存数据结构简单且易于管理，但容量有限。
3、cookie中只能保管ASCII字符串，并需要通过编码方式存储为Unicode字符或者二进制数据。session中能够存储任何类型的数据，包括且不限于string，integer，list，map等。cookie对客户端是可见的，别有用心的人可以分析存放在本地的cookie并进行cookie欺骗，所以它是不安全的。
