How to actually get all values from this array?

Viewed 50

I have this data structure, but I don't know how to access to these "events" because when I do the console.log(data.opis) I get undefined as a output for that part inside of console.

What I am trying to achieve later on is that I will have one div and add all values onto website, but in order (this is actually from the one of the post express things so, they change status (btw. I don't know how many events could be the maximum - so I would have to plan to print out all the values from the events actually)

const data = {
  "sifra": "",
  "datumSlanja": "2022-09-13T14:28:49.143+0200",
  "datumPrijema": "2022-09-21T08:19:53.584+0200",
  "opisPosiljke": null,
  "tezina": "0.50",
  "brojPaketa": 1,
  "vrednostPosiljke": 30,
  "status": 20,
  "statusOpis": "DOSTAVLJENA",
  "centar": "TC-Mostar",
  "mjesto": "Mostar",
  "posiljkuPreuzeo": "VRAĆA SE",
  "events": [{
      "opis": "PREUZETA",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T14:28:49.143+0200"
    },
    {
      "opis": "Pošiljka razdužena u centru slanja",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T15:59:48.134+0200"
    },
    {
      "opis": "Pošiljka kod kurira na dostavi",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T08:35:38.744+0200"
    },
    {
      "opis": "DOGOVORENO PRIMALAC",
      "centar": null,
      "datum": "2022-09-14T12:02:33.325+0200"
    },
    {
      "opis": "ODGOĐENA",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T15:06:39.149+0200"
    }
  ]
};

console.log(data.datumSlanja)
console.log(data.sifra)
console.log(data.datumPrijema)
console.log(data.centar)

4 Answers

You are working with an object, so you have to do next to get events value:

data.events.map(item => { console.log(item.opis); }):

In this case you will have all opis values from events array.

const data = {
  "sifra": "",
  "datumSlanja": "2022-09-13T14:28:49.143+0200",
  "datumPrijema": "2022-09-21T08:19:53.584+0200",
  "opisPosiljke": null,
  "tezina": "0.50",
  "brojPaketa": 1,
  "vrednostPosiljke": 30,
  "status": 20,
  "statusOpis": "DOSTAVLJENA",
  "centar": "TC-Mostar",
  "mjesto": "Mostar",
  "posiljkuPreuzeo": "VRAĆA SE",
  "events": [{
      "opis": "PREUZETA",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T14:28:49.143+0200"
    },
    {
      "opis": "Pošiljka razdužena u centru slanja",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T15:59:48.134+0200"
    },
    {
      "opis": "Pošiljka kod kurira na dostavi",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T08:35:38.744+0200"
    },
    {
      "opis": "DOGOVORENO PRIMALAC",
      "centar": null,
      "datum": "2022-09-14T12:02:33.325+0200"
    },
    {
      "opis": "ODGOĐENA",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T15:06:39.149+0200"
    }
  ]
};

data.events.map(item => {
  console.log(item.opis);
});

You skipped part of the path to the data you're after, and you'd need to address each array element individually.

console.log(data.events[0].opis);

const data = {
  "sifra": "",
  "datumSlanja": "2022-09-13T14:28:49.143+0200",
  "datumPrijema": "2022-09-21T08:19:53.584+0200",
  "opisPosiljke": null,
  "tezina": "0.50",
  "brojPaketa": 1,
  "vrednostPosiljke": 30,
  "status": 20,
  "statusOpis": "DOSTAVLJENA",
  "centar": "TC-Mostar",
  "mjesto": "Mostar",
  "posiljkuPreuzeo": "VRAĆA SE",
  "events": [{
      "opis": "PREUZETA",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T14:28:49.143+0200"
    },
    {
      "opis": "Pošiljka razdužena u centru slanja",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T15:59:48.134+0200"
    },
    {
      "opis": "Pošiljka kod kurira na dostavi",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T08:35:38.744+0200"
    },
    {
      "opis": "DOGOVORENO PRIMALAC",
      "centar": null,
      "datum": "2022-09-14T12:02:33.325+0200"
    },
    {
      "opis": "ODGOĐENA",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T15:06:39.149+0200"
    }
  ]
};

console.log(data.events[0].opis);

You need to do a for loop of some kind like so with the second layer "events" in it. It is a nested object. I like to think of layers in an object like a tree: So the "Trunk" is data -- second layer of branches are "sifra","datumSlanja" ... and "events". Since events is what we want we reference that(data.events).The Third is either opis, centar, datum, BUT since it itself is an array you have to loop over that section of the object to access that data. OR if accessing a specific index you can specify what the index is.


Regular For loop:
for(var x = 0; x < data.events.length; x++){
   var event = data.events[x];
   console.log(event)
}

For Each loop:

data.events.forEach(function(event){
   console.log(event)
})

Working Example:

var obj = {
  "sifra": "",
  "datumSlanja": "2022-09-13T14:28:49.143+0200",
  "datumPrijema": "2022-09-21T08:19:53.584+0200",
  "opisPosiljke": null,
  "tezina": "0.50",
  "brojPaketa": 1,
  "vrednostPosiljke": 30,
  "status": 20,
  "statusOpis": "DOSTAVLJENA",
  "centar": "TC-Mostar",
  "mjesto": "Mostar",
  "posiljkuPreuzeo": "VRAĆA SE",
  "events": [
    {
      "opis": "PREUZETA",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T14:28:49.143+0200"
    },
    {
      "opis": "Pošiljka razdužena u centru slanja",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T15:59:48.134+0200"
    },
    {
      "opis": "Pošiljka kod kurira na dostavi",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T08:35:38.744+0200"
    },
    {
      "opis": "DOGOVORENO PRIMALAC",
      "centar": null,
      "datum": "2022-09-14T12:02:33.325+0200"
    },
    {
      "opis": "ODGOĐENA",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T15:06:39.149+0200"
    }
  ]
}
console.log('For Each Loop: ')
obj.events.forEach(function(event){
    
  console.log(event)
})
console.log('For Loop: ')
for(x=0;x<obj.events.length; x++){
    console.log(obj.events[x])
}

const obj = {
  
  "events": [
    {
      "opis": "PREUZETA",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T14:28:49.143+0200"
    },
    {
      "opis": "Pošiljka razdužena u centru slanja",
      "centar": "TC-Sarajevo",
      "datum": "2022-09-13T15:59:48.134+0200"
    },
    {
      "opis": "Pošiljka kod kurira na dostavi",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T08:35:38.744+0200"
    },
    {
      "opis": "DOGOVORENO PRIMALAC",
      "centar": null,
      "datum": "2022-09-14T12:02:33.325+0200"
    },
    {
      "opis": "ODGOĐENA",
      "centar": "TC-Mostar",
      "datum": "2022-09-14T15:06:39.149+0200"
    }
  ]
};

console.log(obj["events"][0]["opis"]);

When you are trying to access the "events" key, the object must be called first. From the code provided, it does not look like this object has a name, so when data.opis is logged to console, the data object is not found in the code, so it returns undefined.

Secondly, after calling the events object, you will need to put the index for what object you would like to access in the array.

Also, when calling the "opis" key, you are unable to use dot notation since the key has quotation marks around it. You will need to use bracket notation to access this, or you could remove the quotes and then call it using dot notation.

Hope this helped! Cheers.

Related