JSFiddle - React, Tailwind, and code Playground

HTML

<div id=a>
    </a>

JavaScript

(function() {
    
    function makeDot(key, value){
        
        Object.defineProperty(localStorage, key, {
            configurable: true,
            enumerable: true,
              get: function() {
                  return typeof value==="string" && value.slice(0,1)==="ƒ" ? JSON.parse(value.slice(1)) : value;
             }
        });
    }
    
	Storage.prototype.setObject = function(key, value) {
		this.setItem(key,  "ƒ"+JSON.stringify(value));
        makeDot(key, value);
	}
        
    Object.keys(localStorage).forEach(function(a){
        var v=localStorage[a];
        if(typeof v==="string" && v.slice(0,1)==="ƒ"){
            makeDot(a, v);    
        }
    });
    
    
}());


var user = {
	"name": "testName",
	"surname": "testSurname"
};

localStorage.setObject("user", user); //save object
    
alert( localStorage.user.surname ); // shows: "testSurname"