How to remove local storage in javascript

Question

I am studying JavaScript and have been stuck on this for weeks! I need to remove these for items from local Storage. But using localStorage.removeItem('diary'); Will not work.

// Make a demo text item
    data =
        "Friday: We arrived to this wonderful guesthouse after a pleasant journey " +
        "and were made most welcome by the proprietor, Mike. Looking forward to " +
        "exploring the area tomorrow.";
    item = makeDiaryItem("text", data);

    // Make a key using a fixed timestamp
    key = "diary" + "1536771000001";

    // Store the item in local storage
    localStorage.setItem(key, item);

    // Make a demo text item
    data =
        "Saturday: After a super breakfast, we took advantage of one of the many " +
        "signed walks nearby. For some of the journey this followed the path of a " +
        "stream to a charming village.";
    item = makeDiaryItem("text", data);

    // Make a key using a fixed timestamp
    key = "diary" + "1536771000002";

    // Store the item in local storage
    localStorage.setItem(key, item);`

Can someone point me in the right direction? Not looking for a direct answer.

Probably, you don't have an diary key in localStorage. Im viewing your code, and you probably have keys like diary1536771000002. So, the thing that you need to do is search keys that starts with diary and then, remove these. — Lucas Vazquez
– Lucas Vazquez, Commented Mar 6, 2022 at 16:47
Either you keep track of the specific keys you're using (i.e. diary1536771000001 etc) or you use localStorage.clear(). — Will Alexander
– Will Alexander, Commented Mar 6, 2022 at 16:47

NeNaD · Accepted Answer · 2022-03-06 16:47:43Z

1

You need to specify correct keyname that you want to remove from the Local Storage.

In your code, you are setting the item in the Local Storage with the keyname "diary1536771000002". BUT, you are trying to remove the item with keyname "diary".

Try this instead:

localStorage.removeItem('diary1536771000002');

answered Mar 6, 2022 at 16:47

NeNaD

20.8k11 gold badges64 silver badges118 bronze badges

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

1 Comment

Samh625 Over a year ago

Thank you! i've just tried this, if use localStorage.removeItem('diary1536771000002'); and set another one localStorage.removeItem('diary1536771000003'); and so on, one click and it removes them all, is there a way i could create a function so when ever the button is clicked it will remove the correct piece of storage for that diary piece?

Nick Vu · Accepted Answer · 2022-03-06 16:52:58Z

0

You should remove item with the correct key. In your case, the key would be the combination between diary and timestamp

It's possibly like this (because I'm seeing you're using that combination with key variable)

localStorage.removeItem(key);

If it does not work, you can inspect your browser to see the proper key of your local storage (right click on your page and select Inspect and after that you can look for Application tab)

answered Mar 6, 2022 at 16:52

Nick Vu

15.6k5 gold badges29 silver badges37 bronze badges

2 Comments

Samh625 Over a year ago

Thank you, i found the application and its shows the keys as localStorage.removeItem('diary1536771000001'): all the to 4. Trying to find away in which, when i press the delete key it removes that diary pieces information.

Nick Vu Over a year ago

No problem! hope it's useful for you!

jsejcksn · Accepted Answer · 2022-03-06 17:47:43Z

0

If you want to remove all local storage items that begin with a prefix (e.g. "diary"), you could use a function like this:

TS Playground

function removeLocalStorageItems (matcher) {
  const keys = [];

  for (let i = 0; i < localStorage.length; i += 1) {
    const key = localStorage.key(i);
    if (key) keys.push(key);
  }

  const shouldRemove = typeof matcher === 'function' ? matcher : (str) => matcher.test(str);

  for (const key of keys) {
    if (shouldRemove(key)) localStorage.removeItem(key);
  }
}

function removeLocalStorageItemsByPrefix (prefix) {
  removeLocalStorageItems(key => key.startsWith(prefix));
}


// Use:

removeLocalStorageItemsByPrefix('diary');
// or
removeLocalStorageItems(/^diary/);

edited Mar 6, 2022 at 17:47

answered Mar 6, 2022 at 17:00

jsejcksn

34.6k5 gold badges55 silver badges79 bronze badges

Collectives™ on Stack Overflow

How to remove local storage in javascript

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related