如何在localstorage中存入一个对象

什么是localstorage

Window.localStorage参见MDN的解释

localstorage可以干什么

可以利用它来存储本地数据，并且可以跨页面存储，它有两个重要的方法getItem与setItem，顾名思义，是用来取数据与存数据的。

localstorage的用法

setItem(key,value)

接受两个参数，key、value。这里说说value的数据类型，实际上不管value是什么数据类型，存入localstorage后都会变成string类型，也就是说，数据被存入localstorage时会自动调用他们各自的toString()方法。

var a = 123
a.toString()//"123"

var b = true
b.toString()//"true"

var arr = [1,2,3]
arr.toString()//"1,2,3"

var obj = {x:1,y:2}
obj.toString()//"[object Object]"

如果我们将一个对象直接存入localstorage，存入的数据实际上是”[object Object]”，当然用getItem()取出来的数据也是这个，那怎么在localstorage中正常的存入一个对象呢？

我们可以利用localstorage中存入的数据只能是字符串这个特性，在一个对象存入localstorage前将其序列化，取出来的时候再将其还原成一个对象。

var obj = {x:1,y:2}
localStorage.setItem('a',JSON.stringify(obj))
localStorage.getItem('a')//"{"x":1,"y":2}"
JSON.parse(localStorage.getItem('a'))//Object {x: 1, y: 2}

这样就可以在localstorage中存入一个对象了。

• ← Previous Post
• Next Post →