今天在做项目的时候用到了本地存储,要存储的是一个数组对象,数据如下
var data=[{cartNum:1,name:上衣,price:¥100},{cartNum:2,name:牛仔裤,price:¥200}]
我就直接照下面这样存储了,结果存的时候并没有报错,但是取得时候就出错了
照上面的写法取值的时候控制台打印输出是这样的
后来查了下,原来不能直接存储一个对象的,必须使用JSON.stringify把对象转变成字符串再进行存储,那同理,使用的时候刚取出来的数据是字符串类型的,我们应该用JSON.parse()方法来进行解析字符串
所以,正确存储对象的方法
localStorage.setItem('cartInfor',JSON.stringify(data));
所以,正确取出本地存储对象的方法
JSON.parse(localStorage.getItem("cartInfor"))
对于临时存储 sessionStroage同上,这里就不再详细解说
删除存储的方法
localStorage.removeItem("cartInfor")
sessionStorage.removeItem("cartInfor")
删除所有存储的数据方法
localStorage.clear()
sessionStorage.clear()
sessionStroage localStroage cookie之间的区别
1:存储大小限制不同,cookie的数据不能超过4k,而sessionStroage和localStroage也有大小限制,但比cookie大得多,一般是5-10M
2:数据有效期不同,sessionStroage仅在当前窗口关闭前有效,关闭当前浏览器则失效。localStroage是一直有效,除非手动清除掉才会失效,而cookie是根据设置的有效期,在过期时间之前一直有效。
3:作用域不同,sessionStroage在不同的浏览器窗口中是不共享的,而localStroage和cookie在所有同源窗口中都是共享的。
4:cookie数据始终在同源的http请求中携带(即使不需要),即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器,仅在本地保存