JQuery本地存储的一个缺点

2023-09-25 23:23:58

假如我们需要写一个类似记事本的功能的时候，需要用到本地存储（用户关闭页面，数据不会丢失）

localStorage 里面只能存储字符串类型的数据格式。

但是存放用户数据的方式往往选用数组（存放多条用户数据）来存储

如果不进行一些必要的转换就会出现如下情况：

如上图所示，我们无法看到里面存储的数据，这里原本存储的是一个自定义数组

var todolist=[{

     title:'我今天吃八个馒头',
     done：false
},{
     title:'我今天学习jq',
    done:false
    },
];

因此，我们需要把 数组格式 转换为 字符串格式

需要用到这个方法： JSON.stringify()

没使用方法前：localStrongage("todo",todolist) // 无法存储

使用方法后: localStrongage("todo",JSON.stringify(todolist))

此时控制台输出结果为：

当需要获取本地存储里面的数据的时候，又需要考虑另一个问题，存储的数据是字符串，没有办法使用数组属性，无法正常输出，输出结果将是undefined

所以，取出本地存储数据的时候，需要把里面的字符串格式转换为对象格式 我们需要用到另一个方法：JSON.parse()

代码如下：

var data=localStorage.getItem("todo");
data=JSON.parse(data);
console.log(data);

此时结果输出为

这样即可正常使用localStrong的数据

码农公寓