3

I am looking for quick way to get an item from the Mozilla localStorage based on partial knowledge of an unique key. I have the following structure defined as the key : value

UUID1 : "BLABLABLA": UUID2 : Value

Where the key part looks like this for example:

ca4417f4-f83b-11eb-bf45-ffc420139ccb:BLABLABLA:e1d26c40-f83b-11eb-81c0-fbcc16bf6bdb

Value is just a long string.

What would be the fastest way to find a SINGLE key from localStorage based on only one of the two UUIDs i.e. either UUID1 or UUID2, then obtain the full key string and then use

localStorage.getItem to return it's value

maybe using Object.entries(localStorage)?

a code example would be really appreciated?

1
  • Object.entries(localStorage) should work fine....did you try it? Commented Aug 8, 2021 at 12:00

2 Answers 2

3

The Storage interface has a length property telling you how many items are there, and a key method that gives you the key for item index n. So you can loop through to find the key with a for loop:

let key;
for (let n = 0, len = localStorage.length; n < len; ++n) {
    const thisKey = localStorage.key(n);
    if (thisKey.includes("BLABLABLA")) {
        // found it
        key = thisKey;
        break;
    }
}
if (key) {
    const value localStorage.getItem(key);
    // ...
}

Note that solutions using Object.keys, Object.entries, etc. won't work reliably with all storage keys — for instance, the key "length" won't work properly even though it's just fine to use "length' as a key with getItem and setItem. That's because the Storage interface already defines a property called length (the length of the storage list), so you can't access a stored item keyed by "length' using localStorage.length, you have to localStorage.getItem("length"). Object.keys and Object.entries will leave out those storage entries. (Other than it appears there's a weird bug in Chrome around the "key" key.) The above works reliably with length, key, and other similar keys (but really it's length and key that are the most problematic).

In your particular case, though, you know the key isn't length or key or any of the other things on Storage.prototype, so you could create an array of keys via Object.keys and use find to find the key:

// Read the disclaimers above
const key = Object.keys(localStorage).find(key => key.includes("BLABLABLA"));
if (key) {
    const value localStorage.getItem(key);
    // ...
}

...or use Object.entries to create an array of arrays as charlietfl shows. Just be mindful of the caveat.

Sign up to request clarification or add additional context in comments.

10 Comments

T.J. can you please post an example how this might look?
in this case i understand that i am looping over the whole map once, and then i use the found key with the method localStorage.getItem to get it's value. thank you.
@RoboRobok - Because it works reliably, while options relying on the storage keys being properties of the storage object don't. If you know of a reliable alternative, the constructive thing to do is to post an answer.
"really it's length that's the most problematic", key is quite common too.
key shouldn't be here from Object.keys either, weird indeed. Seems to be Chrome only.
|
2

Expanding on your Object.entries() concept you can do something like:

// set a demo key/value
localStorage.setItem('foobar', 100);

const [wantedKey, wantedValue] = Object.entries(localStorage).find(([k,v])=> k.startsWith('foo'))



console.log([wantedKey, wantedValue])

Working jsfiddle

3 Comments

There should be a note about the usual pitfalls of using localStorage as an object directly, namely keys like length, getItem, setItem, key etc. won't be retrieved.
This also won't work on IE11, but that's increasingly irrelevant (though sadly not completely irrelevant yet). Using Object.keys would.
Actually, Object.keys would leave out "length", too.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.