f12 会检测您所在的任何页面。 单击“应用程序”。 单击存储javascript存储，您将在那里看到本地存储和会话存储。
图片.png
本地存储和会话存储都存储通配符对
本地存储和会话存储之间的主要区别在于javascript存储，会话存储中存储的通配符对在关闭浏览器后会丢失。
现在，让我们通过一些示例来了解如何使用本地存储。
示例 1：将通配符对提供到本地存储。
localStorage.setItem("name", 'Rajat');
本地存储
在前面的示例中，我们了解了如何在本地存储中设置通配符对。 现在，让我们看看如何从本地存储中获取项目。
示例2：
let name = localStorage.getItem('name')
console.log(name)
图片.png
现在，让我们尝试获取一些不存在的值。
示例3：
let name = localStorage.getItem('name2')
console.log(name)
图片.png
如果您尝试从本地存储中获取不存在的单个内容，则结果将为空。
很多时候我们希望将链表存储在本地存储中，因为链表易于使用（我们有很多外部链表方法）。 然而，本地存储的一个限制是它将链表存储为字符串。
localStorage.setItem('name', 'Rajat');
let fruitsArray = ['Apple', 'Banana', 'Orange', 'Grapes', 'Mango']
localStorage.setItem('imArray', fruitsArray);
图片.png
为了克服这个问题，我们使用 JSON.stringify。 请看下面的实际操作：
示例 4：将链表存储在本地存储中：
localStorage.setItem('name', 'Rajat');
let fruitsArray = ['Apple', 'Banana', 'Orange', 'Grapes', 'Mango']
localStorage.setItem('imArray', JSON.stringify(fruitsArray));
图片.png
示例 5：从本地存储获取字段。
console.log(localStorage.getItem('imArray'));
图片.png
上面的结果可能看起来像一个字段，但我们从本地存储中获取字符串而不是字段。 让我证明一下。
console.log(typeof localStorage.getItem('imArray'));
图片.png
因此，为了从本地存储中获取字段，我们使用 JSON.parse。 见下文。
示例 6：从本地存储获取字段？
console.log(JSON.parse(localStorage.getItem('imArray')));
因此，我们使用：
JSON.stringify：将字段设置为本地存储中的值。 JSON.parse：从本地存储获取字段。
示例7：清除本地存储。
localStorage.setItem('Name1', 'Rajat');
let fruitsArray = ['Apple', 'Banana', 'Orange', 'Grapes', 'Mango']
localStorage.setItem('impArray', JSON.stringify(fruitsArray));
localStorage.clear()
因此，我们可以使用localStorage.clear()。
示例 8：仅从本地存储中删除“name”键值对。
localStorage.setItem('name', 'Rajat');
let fruitsArray = ['Apple', 'Banana', 'Orange', 'Grapes', 'Mango']
localStorage.setItem('imArray', JSON.stringify(fruitsArray));
localStorage.removeItem('name');
图片.png
正如您在里面听到的，为了删除特定的通配符，我们使用 localStorage.removeItem。
这就是本地存储的全部内容。
我们在会话存储中运行类似的操作，唯一的区别是我们使用会话存储而不是本地存储：
sessionStorage.setItem("name, 'Rajat');
sessionStorage.getItem("name");
sessionStorage.setItem('imArray', JSON.stringify(fruitsArray));
console.log(JSON.parse(sessionStorage.getItem('imArray')));
sessionStorage.clear()
sessionStorage.removeItem('Name1');
让我重申一下：本地存储和会话存储之间的唯一主要区别是，一旦我们关闭浏览器，我们就会丢失会话存储中保存的所有内容。 然而，本地存储的情况并非如此。
最后我们来看看MDN是怎么说的：
窗口的 localStorage 只读属性允许您访问 Document 源的 Storage 对象； 存储的数据在浏览器会话中持续存在。
只读 sessionStorage 属性访问当前源的会话存储对象。 sessionStorage与localStorage类似； 不同之处在于，localStorage 中的数据不会过期，而 sessionStorage 中的数据会在页面会话结束时被擦除。
