Local storage示范

好的，我明白了。下面是 Local storage 的示范，我会尽力解释得尽可能详细。

Local storage 是一种浏览器本地存储机制，它允许 web 应用程序在浏览器上存储数据，以便在会话期间或下一次会话期间使用。

下面是一个示例，演示如何使用 Local storage 存储和检索字符串值：

// 存储值
localStorage.setItem('name', 'John');

// 获取值
var name = localStorage.getItem('name');

// 输出值
console.log(name); // 'John'

这一段代码的意思是：我们用 localStorage.setItem 将字符串 "John" 存入 key 为 "name" 的本地存储中，然后通过 localStorage.getItem 方法获取这个本地存储中的字符串，并将其存储在变量 name 中，最后打印出来 name 的值，也就是 "John"。

此外，还有其他与 Local storage 相关的 API。下面是一个完整的示例，演示如何使用 Local storage 存储和检索 JSON 值：

// 存储值
var person = {
name: "John",
age: 30,
city: "New York"
};
localStorage.setItem('person', JSON.stringify(person));

// 获取值
var storedPerson = localStorage.getItem('person');
var retrievedPerson = JSON.parse(storedPerson);

// 输出值
console.log(retrievedPerson.name); // 'John'
console.log(retrievedPerson.age); // 30
console.log(retrievedPerson.city); // 'New York'

这个示例中，我们首先创建了一个包含三个属性的 JavaScript 对象 person，然后使用 localStorage.setItem 将其序列化为 JSON 字符串并存储在本地存储中。接着，我们使用 localStorage.getItem 获取这个本地存储值，解析 JSON 字符串，并将其存储在变量 retrievedPerson 中。最后，我们分别打印出这个对象的三个属性值，也就是 "John"、30 和 "New York"。

希望这个示范能帮助您了解 Local storage 的用法和原理。