如何在JavaScript的localStorage中存储与检索多维数组

嘿，这个问题我太清楚了！localStorage本身只支持存储字符串类型的数据，所以多维数组没法直接存进去，但咱们可以借助JSON的序列化/反序列化来完美解决这个问题，步骤超简单，我给你详细说说：

一、存储多维数组到localStorage #

核心思路就是先把多维数组转换成JSON字符串，再存入localStorage：

1. 准备好你的多维数组
2. 使用JSON.stringify()方法将数组转换为JSON字符串
3. 调用localStorage.setItem()方法，把字符串存进去

举个实际的代码例子：

// 定义一个包含多种数据类型的多维数组
const myMultiArray = [
  [10, 20, 30],
  ["苹果", "香蕉", "橙子"],
  [true, false, undefined] // 注意：undefined会被JSON.stringify转为null
];

// 序列化并存储
localStorage.setItem('savedMultiArray', JSON.stringify(myMultiArray));

二、从localStorage检索多维数组 #

要把存储的数组取出来使用，只需要反向操作：

1. 用localStorage.getItem()获取存储的JSON字符串
2. 使用JSON.parse()方法将字符串解析回多维数组

代码示例：

// 取出存储的字符串
const storedString = localStorage.getItem('savedMultiArray');

// 解析为多维数组，同时处理key不存在的情况
const retrievedArray = storedString ? JSON.parse(storedString) : [];

// 现在就能正常操作数组了
console.log(retrievedArray[1][1]); // 输出：香蕉
console.log(retrievedArray[2][2]); // 输出：null（因为原数组里的undefined被序列化转成了null）

几个需要注意的细节 #

• 特殊值处理：JSON不能序列化函数、Symbol、undefined这类值，JSON.stringify()会把undefined转为null，函数和Symbol则会被直接忽略（如果在数组里），所以如果你的数组里有这些特殊类型，得提前做处理。
• 空值判断：如果存储的key不存在，localStorage.getItem()会返回null，直接JSON.parse(null)会得到null，所以最好加个判断，避免后续操作报错。
• 存储容量限制：localStorage的存储上限大概是5MB左右，太大的多维数组可能存不下，这点也要留意。

内容的提问来源于stack exchange，提问作者dhina2525