I have an object which I'm getting by executing a function of SDK. When I try to store the object in session storage and the retrieve the object, the retrieved object looks same as original but when I perform operations on the new object I'm getting error.
var xyzObject = some_function();
sessionStorage.setItem("xyzObject",xyzObject);
var obj = JSON.parse(sessionStorage.getItem("xyzObject"));
obj.some_other_function();
It is showing an error as obj.some_other_function is not a function. Whereas xyzObject.some_other_function works perfectly.
I have an object which I'm getting by executing a function of SDK. When I try to store the object in session storage and the retrieve the object, the retrieved object looks same as original but when I perform operations on the new object I'm getting error.
var xyzObject = some_function();
sessionStorage.setItem("xyzObject",xyzObject);
var obj = JSON.parse(sessionStorage.getItem("xyzObject"));
obj.some_other_function();
It is showing an error as obj.some_other_function is not a function. Whereas xyzObject.some_other_function works perfectly.
Share Improve this question edited Nov 7, 2016 at 10:17 Sanket Tarodekar asked Nov 7, 2016 at 9:40 Sanket TarodekarSanket Tarodekar 3024 silver badges13 bronze badges 2-
The Web Storage API only supports strings:
storage.setItem(keyName, keyValue)
wherekeyName
andkeyValue
areDOMString
s – Andreas Commented Nov 7, 2016 at 9:44 - Try JSON.stringify when saving the object. You can only store it as string. – juju Commented Nov 7, 2016 at 10:22
4 Answers
Reset to default 3Try
sessionStorage.setItem('xyzObject', JSON.stringify(xyzObject);
And retrieve using:
JSON.parse(sessionStorage.getItem('xyzObject'));
You cannot store an object in the sessionStorage or localStorage. The only possible method is to stringify the object and save that in sessionStorage and on receiving the object from sessionStorage you just parse the object to JSON.
var xyzObject = some_function();
sessionStorage.setItem("xyzObject",JSON.stringify(xyzObject));
var stringData = sessionStorage.getItem("xyzObject");
var obj = JSON.parse(stringData);
obj.some_other_function();
sessionStorage only stores strings as values.
If you want to store an object in sessionStorage, you must stringify the object into a JSON string, using the JSON.stringify()
method.
const xyzObject = { name: "Juan" };
sessionStorage.setItem("xyzObject", JSON.stringify(xyzObject);
Then if you want to read the JSON string stored, you must parse it into a JavaScript object (or value, array, etc) , using the JSON.parse()
method.
const xyzObjectRetrieved = JSON.parse(sessionStorage.get("xyzObject"));
// it should equal { name: "Juan" }
Source:
- sessionStorage
- JSON.stringify
- JSON.parse
sessionStorage
stores key-value pairs, both being strings. So, whenever your
sessionStorage.setItem("xyzObject",xyzObject);
line executes, a key of xyzObject
is upserted into sessionStorage and a string is stored as a value. Since
xyzObject` is an object, it is converted into a string. Let's convert an object into a string and see what happens:
let foo = {
a: 1,
b: 2,
c: function() {
console.log(3);
}
}
console.log(foo + "");
The result is
therefore we need to somehow convert our object into a string, because the automatic way is not exactly desirable.
let foo = {
a: 1,
b: 2,
c: function() {
console.log(3);
}
}
console.log(JSON.stringify(foo));
The result yields back the data members properly, but it fails to consider the function properly. So, how could we solve our problem? We could implement a function that recreates an object:
function initializeObject(obj) {
obj.c = function() {
console.log(3);
}
return obj;
}
let foo = initializeObject({
a: 1,
b: 2,
});
let json = JSON.stringify(foo);
console.log(json);
let bar = initializeObject(JSON.parse(json));
bar.c();
As you can see, when its stringified, it still does not have the function, but nevertheless we can reconstruct the object by parsing it into a JSON and appending the functions. So, your some_function
should be modified to accept an object and whatever data-members it has, it should ensure that the resulting object would ply to them and functions will be appended.