LocalStorage存储JSON对象、存储数组
1、存储普通数组:举例:(也可用下面第三条的方法)
-
var arr = [1, 2, 3];
-
localStorage.setItem("temp", arr);
-
console.log(typeof localStorage.getItem("temp"));//string
-
console.log(localStorage.getItem("temp"));//返回字符串'1,2,3'
上面例子中 localStorage.setItem() 将数组自动转成了字符串形式;但它不会将JSON对象转成字符串。举例:
-
var obj = {"a": 1, "b": 2};
-
localStorage.setItem("temp2", obj);
-
console.log(typeof localStorage.getItem("temp2"));//也会返回String
-
console.log(localStorage.getItem("temp2"));//但是返回[object Object]
2、存储JSON对象:
正确存储JSON对象的方法是:
存储前先用JSON.stringify()方法将json对象转换成json字符串形式;
【JSON.stringify() 方法可以将任意的 JavaScript 值序列化成 JSON 字符串。】
后续要用对象时,用JSON.parse()方法将之前存储的hson字符串转成json对象。
举例:
-
var obj3 = {"a": 1, "b": 2};
-
localStorage.setItem("temp3", JSON.stringify(obj3));
-
console.log(typeof JSON.parse(localStorage.getItem("temp3")));//返回object
-
console.log(JSON.parse(localStorage.getItem("temp3")));//返回{a: 1, b: 2}
避免因为存储的键名不存在返回对象为null的情况,建议这样读取json对象:
console.log(JSON.parse(localStorage.getItem("temp4")||'{}'));//返回对象
3、存储JSON对象数组:(方法与存储json对象相似),举例:
-
var obj3 = [{"a": 1, "b": 2}, {"c": 3, "d": 4}];
-
localStorage.setItem("temp3", JSON.stringify(obj3));
-
console.log(JSON.parse(localStorage.getItem("temp3")||'[]'));//返回对象数组