Using a type of localStorage in javascript that I can't seem to find anywhere

Question

So I have a save and load function I was working on probably a year ago and cannot find example of saving and loading in this manor. My issue is that I'm not saving and loading these numbers as integers but I can't remember or find what I need to do to make these numbers save/load as integers. Sorry for such a trivial question but this is always a great place to go.

   function saveGame() {
            localStorage["ClickMiner.savedBefore"] = savedBefore;
            localStorage["ClickMiner.manaRefilCost"] = manaRefilCost;
            localStorage["ClickMiner.rocks"] = rocks;
            localStorage["ClickMiner.miningXp"] = miningXp;
            localStorage["ClickMiner.miningLevel"] = miningLevel;
            localStorage["ClickMiner.pickaxes"] = pickaxes;
            localStorage["ClickMiner.pebbleGrowers"] = pebbleGrowers;
            //localStorage["ClickMiner.rockTier"] = rockTier;
            localStorage["ClickMiner.rockTierCost"] = rockTierCost;
            localStorage["ClickMiner.bankedRocks"] = bankedRocks;
            updateTextBox("Game Saved");
            return true;
    } 

     function loadGame() {
            savedBefore = (localStorage["ClickMiner.savedBefore"]);
            manaRefilCost = (localStorage["ClickMiner.manaRefilCost"]);
            rocks  = (localStorage["ClickMiner.rocks"]);
            miningXp = (localStorage["ClickMiner.miningXp"]);
            miningLevel = (localStorage["ClickMiner.miningLevel"]);
            pickaxes = (localStorage["ClickMiner.pickaxes"]);
            pebbleGrowers = (localStorage["ClickMiner.pebbleGrowers"]);
            //rockTier = (localStorage["ClickMiner.rockTier"]);
            rockTierCost = (localStorage["ClickMiner.rockTierCost"]);
            bankedRocks = (localStorage["ClickMiner.bankedRocks"]);
            updateTextBox("Game Loaded");
            return true;
    } 

     function newGame() {
        savedBefore = 1;
        localStorage["ClickMiner.savedBefore"] = savedBefore;
        localStorage["ClickMiner.manaRefilCost"] = manaRefilCost;
        localStorage["ClickMiner.rocks"] = rocks;
        localStorage["ClickMiner.miningXp"] = miningXp;
        localStorage["ClickMiner.miningLevel"] = miningLevel;
        localStorage["ClickMiner.pickaxes"] = pickaxes;
        localStorage["ClickMiner.pebbleGrowers"] = pebbleGrowers;
        //localStorage["ClickMiner.rockTier"] = rockTier;
        localStorage["ClickMiner.rockTierCost"] = rockTierCost;
        localStorage["ClickMiner.bankedRocks"] = bankedRocks;
        location.reload();
        updateTextBox("New Game Started.");
        return true;
    } 

Answer 1

Localstorage works only with strings.

parseInt(variable)

Should do the job

Answer 2

If you want a thing to be an integer, all you need to do is use the parseInt function. Everything stored in localStorage is a string, so you would do the integer conversion in loadGame() .

Like this:

function loadGame() {
    savedBefore = parseInt(window.localStorage["ClickMiner.savedBefore"], 10);
    // and so on...

}

The 10 of parseInt(aThing, 10) is the radix, meaning you want base10 integers (0-9) and not binary, hex or some other number system.

Answer 3

Instead of pushing the storage for saving data as integer, I would prefer to ensure if my data type is integer. If I am pretty sure if my data in expected type then, I would use JSON.stringify and JSON.parse to between write and read operations. Because localStorage will accept only string value. That mean, if you give a number as value it will be converted to string. So, the output type from localStorage will be string.

By considering all of above, here is a quick snippet to achive your expectations by avoiding many changes on your code.

 const localStorageProxy = new Proxy(localStorage, { get(target, prop){ if(target.hasOwnProperty(prop) && typeof target[prop] === "function"){ return target[prop]; } return JSON.parse(target.getItem(prop)||"null"); }, set(target, prop, value){ target.setItem(prop, JSON.stringify(value)); } }); // testing console.log(localStorageProxy["testNumber"]); localStorageProxy["testNumber"] = 123; console.log(localStorageProxy["testNumber"], typeof localStorageProxy["testNumber"]); 

PS: The snippet above may not work correctly because of security restrictions. Here is the fiddle link