本地存储仅显示保存的最后一个值- JS

本地存储是指在浏览器中存储数据的一种机制，可以将数据保存在用户的本地设备上，以便在不同的页面或会话之间进行持久化存储。在JavaScript中，常用的本地存储方式有两种：localStorage和sessionStorage。

localStorage是一种持久化的本地存储方式，保存的数据在浏览器关闭后仍然存在。它以键值对的形式存储数据，并且只能存储字符串类型的数据。可以通过localStorage.setItem(key, value)方法来设置数据，通过localStorage.getItem(key)方法来获取数据，通过localStorage.removeItem(key)方法来删除数据。

sessionStorage是一种会话级别的本地存储方式，保存的数据只在当前会话中有效，当用户关闭浏览器标签页或浏览器窗口时，数据将被清除。与localStorage类似，sessionStorage也以键值对的形式存储数据，并且只能存储字符串类型的数据。可以通过sessionStorage.setItem(key, value)方法来设置数据，通过sessionStorage.getItem(key)方法来获取数据，通过sessionStorage.removeItem(key)方法来删除数据。

在使用本地存储时，需要注意以下几点：

1. 存储的数据大小有限制，通常为5MB左右，超过限制可能会导致存储失败。
2. 存储的数据仅在同源页面中共享，不同域名或不同协议的页面无法访问对方的本地存储数据。
3. 由于本地存储是在客户端进行的，因此存在数据被篡改或窃取的风险，敏感数据应进行加密处理。

本地存储在前端开发中有广泛的应用场景，例如：

1. 用户登录状态的保存：可以使用本地存储来保存用户的登录状态，以便在用户下次访问网站时自动登录。
2. 表单数据的缓存：可以使用本地存储来缓存用户在表单中输入的数据，以防止用户刷新页面或意外关闭页面时数据丢失。
3. 离线应用：可以使用本地存储来缓存应用的资源文件，使应用在离线状态下仍然可以正常访问。

腾讯云提供了一系列与本地存储相关的产品和服务，例如：

1. 对象存储（COS）：腾讯云对象存储（COS）是一种高可用、高可靠、强安全的云存储服务，可以用于存储和管理海量的非结构化数据，支持多种数据类型的存储和访问方式。详情请参考：腾讯云对象存储（COS）
2. 云硬盘（CVM）：腾讯云云硬盘（CVM）是一种高性能、高可靠的云端块存储服务，可以为云服务器提供持久化的数据存储。详情请参考：腾讯云云硬盘（CVM）

以上是关于本地存储的概念、分类、优势、应用场景以及腾讯云相关产品的介绍。希望对您有所帮助！