localStorage存储JSON对象的小方法
有时候,我们需要将数据存储到sessionStorage和localStorage中,这样做的好处有:
1 缓存数据
2 减少对内存的占用
但是,storage只能存储字符串的数据,对于JS中常用的数组或对象却不能直接存储。
1 2 3 4 5 6 7 | var obj = { name: 'Jim' }; sessionStorage.obj = obj; localStorage.obj = obj; var arr = [1,2,3]; sessionStorage.obj = arr; localStorage.obj = arr; |
上面的写法都是不能成功的!但我们可以通过JSON对象提供的parse和stringify将其他数据类型转化成字符串,再存储到storage中就可以了。请看下面的代码。
1 2 3 4 5 6 7 8 9 | var obj = { name: 'Jim' }; var str = JSON.stringify(obj); //存入 sessionStorage.obj = str; //读取 str = sessionStorage.obj; //重新转换为对象 obj = JSON.parse(str); |
localStorage也一样,只是和sessionStorage的存储时间不一样。
需要注意的是,JS中的数组本质上也是对象类型,所以上面的代码对数组也是适用的。
利用localStorage可以简单的存储一些JSON对象,可以方便简易应用的数据存储。
简单介绍下localStorage,localStorage是html5提供的一种本地存储的方法,可以把数据存储在本地浏览器,下次打开后仍然可以获取到存储的数据,如果在存储的数据 量小的时候可以起到代替数据库的功能,比cookies更有优越性。
localStorage.setItem("key","value");//存储变量名为key,值为value的变量 localStorage.key = "value"//存储变量名为key,值为value的变量 localStorage.getItem("key");//获取存储的变量key的值www.it165.net localStorage.key;//获取存储的变量key的值 localStorage.removeItem("key")//删除变量名为key的存储变量
以上即为localStorage调用的方法。下面介绍存储JSON对象的方法。
上面即可保存JSON对象,接下来我们在要使用的时候再将存储好的students变量取回
var students = localStorage.getItem("students");//取回students变量
students = JSON.parse(students);//把字符串转换成JSON对象
以上即可得到存储的students的JSON对象了
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步