get the items from local storage

Question

I tried to insert some values in to local storage. and O need to fetch the details. But I cannot get the data as per the requirement

console.log("saving data to local storage")
      var newItem = {
        title: $('#title').val(),
        description: $('#description').val()
      }
      if (localStorage.getItem("newData") === null) {
        localStorage.setItem("newData", JSON.stringify(newItem));
      }
      else {
        var oldItems = JSON.parse(localStorage.getItem('newData')) || [];
        oldItems.push(newItem);
        localStorage.setItem('newData', JSON.stringify(oldItems));
      }

here I saved my local storage data, then I need to fetch each details

this is my local storage saved data

[{"title":"e2","description":"e2"},{"title":"a2","description":"a2"},{"title":"r2","description":"r2"},{"title":"y2","description":"y2"}]

I need to fetch the each data, i tried this way. but not getting the details

var newArr = window.localStorage.getItem('newData');
for (var i = 0, len = newArr.length; i < len; i++) {
  savedPerson = JSON.parse(newArr[i]);
  console.log(savedPerson)
  console.log(savedPerson.title)
  console.log(savedPerson.description)
}

How can I do this

Answer 1

You set newItem to an object, and call localStorage.setItem("newData", JSON.stringify(newItem)); to save it.

Then var oldItems = JSON.parse(localStorage.getItem('newData')) will return a string, but a string does not have a push method.

What you might do is create an array, and add the objects to it. Then you can iterate the array of objects.

As an example

var newItem = {
    title: $('#title').val(),
    description: $('#description').val()
}

if (localStorage.getItem("newData") === null) {
    localStorage.setItem("newData", JSON.stringify([newItem]));
} else {
    var oldItems = JSON.parse(localStorage.getItem('newData'));
    oldItems.push(newItem);
    localStorage.setItem('newData', JSON.stringify(oldItems));
}

var newArr = JSON.parse(window.localStorage.getItem('newData'));

for (var i = 0, len = newArr.length; i < len; i++) {
    var savedPerson = newArr[i];
    console.log(savedPerson)
    console.log(savedPerson.title)
    console.log(savedPerson.description)
}

Answer 2

This would give you a basic understanding of how you are supposed to retrieve the JSON data:

// READ STRING FROM LOCAL STORAGE
var retrievedObject = localStorage.getItem('newData');

// CONVERT STRING TO REGULAR JS OBJECT
var parsedObject = JSON.parse(retrievedObject);

// ACCESS DATA
for (var i = 0, len = parsedObject.length; i < len; i++) {
  savedPerson = parsedObject[i]
  console.log(savedPerson)
  console.log(savedPerson.title)
  console.log(savedPerson.description)
}

Answer 3

Later part of your code is wrong. Please check this code.

console.log("getting data from local storage");

var newArr = JSON.parse(window.localStorage.getItem('newData'));

for (var i = 0; i < newArr.length; i++) {
  var savedPerson = newArr[i];
  console.log(savedPerson);
  console.log(savedPerson.title)
  console.log(savedPerson.description)
}