JS localStorage存储对象，sessionStorage存储数组对象操作示例

JS localStorage 和 sessionStorage 都是 HTML5 新增的特性，它们都可以用来在浏览器端存储数据。其中 localStorage 存储的数据没有过期时间，而 sessionStorage 存储的数据在一次会话过程中有效，在用户关闭窗口或浏览器时会被清除。

存储对象示例

如果要存储一个对象到 localStorage 或 sessionStorage，需要将对象先转换成 JSON 字符串格式，然后再进行存储。存储对象的步骤如下：

1. 创建一个 JavaScript 对象，包含需要存储的数据。

javascript
var person = {
"name": "张三",
"age": 20,
"gender": "male"
};

1. 将 JavaScript 对象转换为 JSON 字符串。

javascript
var personStr = JSON.stringify(person);

1. 将 JSON 字符串存储到 localStorage 或 sessionStorage。

javascript
localStorage.setItem("person", personStr);
sessionStorage.setItem("person", personStr);

这里我们分别将 person 对象存入 localStorage 和 sessionStorage。其中，setItem 方法的第一个参数是存储的键，第二个参数是存储的值。

1. 从 localStorage 或 sessionStorage 中读取 JSON 字符串，并将其转换成 JavaScript 对象。

```javascript
var personFromLocalStorageStr = localStorage.getItem("person");
var personFromSessionStorageStr = sessionStorage.getItem("person");

var personFromLocalStorageObj = JSON.parse(personFromLocalStorageStr);
var personFromSessionStorageObj = JSON.parse(personFromSessionStorageStr);
```

读取和解析 JSON 字符串的步骤和上面的存储对象步骤差不多。

这里需要注意的是，如果从 localStorage 或 sessionStorage 中读取的 JSON 字符串不存在或者格式不正确，解析时会出错，可以加上 try-catch 处理异常情况。

javascript
try {
var personFromLocalStorageObj = JSON.parse(personFromLocalStorageStr);
} catch (e) {
console.error("解析 localStorage 中的数据时出错！", e);
}

存储数组对象示例

如果要存储一个数组对象到 localStorage 或 sessionStorage，这里以一个存储学生列表为例，包含学生姓名、性别和年龄。存储数组对象的步骤如下：

1. 创建一个 JavaScript 数组，包含需要存储的数据。

javascript
var students = [
{
"name": "张三",
"gender": "male",
"age": 18
},
{
"name": "李四",
"gender": "female",
"age": 19
},
{
"name": "王五",
"gender": "male",
"age": 20
}
];

1. 将 JavaScript 数组转换为 JSON 字符串。

javascript
var studentsStr = JSON.stringify(students);

1. 将 JSON 字符串存储到 localStorage 或 sessionStorage。

javascript
localStorage.setItem("students", studentsStr);
sessionStorage.setItem("students", studentsStr);

这里我们分别将 students 数组存入 localStorage 和 sessionStorage。其中，setItem 方法的第一个参数是存储的键，第二个参数是存储的值。

1. 从 localStorage 或 sessionStorage 中读取 JSON 字符串，并将其转换成 JavaScript 数组对象。

```javascript
var studentsFromLocalStorageStr = localStorage.getItem("students");
var studentsFromSessionStorageStr = sessionStorage.getItem("students");

var studentsFromLocalStorageObj = JSON.parse(studentsFromLocalStorageStr);
var studentsFromSessionStorageObj = JSON.parse(studentsFromSessionStorageStr);
```

这里读取和解析 JSON 字符串的步骤和上面的存储对象步骤相同。需要注意的是，如果从 localStorage 或 sessionStorage 中读取的 JSON 字符串不存在或者格式不正确，解析时会出错，可以加上 try-catch 处理异常情况。