了解Java script中的localStorage

什么是kie 有何不同？？

localStorage是一种在客户端，在浏览器中存储数据的方法。此数据存储在键/值对中，可供在该页面上运行的 JavaScript 代码使用。

localStorage是持久的，这意味着即使关闭并重新打开浏览器，数据也会保留。这使其成为存储需要稍后访问的数据（例如用户首选项或设置）的不错选择。

重要的是要知道存储在其中的数据localStorage是特定于域的，因此存储在一个站点上的数据将无法用于另一个站点。

localStorage 与 cookie 有何不同？

localStorage和 cookie之间有一些关键的区别。首先，本地存储不会像 cookie 那样随每个 HTTP 请求一起发送，因此效率更高。其次，本地存储数据是持久的，这意味着它不会像 cookie 那样过期。最后，本地存储数据也更安全，因为它不像 cookie 那样通过网络传输。

如何使用本地存储

现代浏览器提供了一个清晰的 API 来使用localStorage，在本节中，我们将仔细研究允许我们使用这个工具的方法。

存储数据

localStorage用于将数据存储在键/值对中。该setItem()方法用于存储数据：

localStorage.setItem('key', 'value');

是要存储的项目的'key'名称， 是要存储'value'的数据。

检索数据

getItem()方法用于检索数据：

localStorage.getItem('key');

这将返回与指定键关联的值，或者null如果该键不存在。

从本地存储中删除数据

removeItem()方法用于删除数据：

localStorage.removeItem('key');

这将删除与指定键关联的数据。

清除本地存储

clear()方法用于清除所有数据localStorage：

localStorage.clear();

此方法从 中删除所有数据localStorage，包括与任何键无关的数据。

本地存储示例

这是一个将用户名存储在的简单示例localStorage：

localStorage.setItem('name', 'John Smith'); 

let name = localStorage.getItem('name'); 

console.log(name); 
localStorage.removeItem('name');

此示例首先在localStorage使用该setItem()方法时存储一个名称。localStorage然后它使用该getItem()方法检索名称。localStorage最后，它从使用removeItem()方法中删除名称。

localStorage 的限制

localStorage是一个强大的工具，但它有一些限制。

首先，正如我们在文章开头已经提到的，存储在 localStorage 中的数据是特定于域的。这意味着存储在一个域上的数据不能被另一个域访问。

其次，localStorage只支持字符串。这意味着非字符串的数据（例如对象）必须先转换为字符串，然后才能存储在 localStorage 中。

三localStorage是不安全。存储在localStorage其中的数据未加密，可以通过页面上的任何代码访问。

四localStorage是不靠谱。localStorage如果用户清除浏览器缓存或 cookie，存储在其中的数据可能会丢失。

结论

localStorage是一种在浏览器本地存储数据的简单方便的方法。它可以成为您工具箱的强大补充。

请记住 的限制localStorage，并确保在存储复杂数据结构之前对其进行序列化。