Home > Enterprise >  javascript access json object
javascript access json object

Time:04-14

i´ve got a question regarding accessing json objects/arras via javascript: so i have this array (got it from the backend):

let resp = [
    {
        "4-13-2022": {
            "8:28:53 PM": {
                "title": "one",
                "topic": "two",
                "details": "tree",
                "type": "thought"
            }
        }
    }
]

and i want to access the "title" value.

Things i tried:

  • resp[0][0].title
  • resp[0][0][0]
  • resp[0][0][0].title
  • resp[0].title

any of my attempts returned a undefined error/response any advice?

EDIT: here is the full snippet:

<script>
        const getid = (id) => document.getElementById(id);
        let overview = "";
        let resp = [];
        let temp = [
            {
                "8:28:53 PM": {
                    title: "one",
                    topic: "two",
                    details: "tree",
                    type: "thought",
                },
            },
        ];
        fetch("http://localhost:1200/rData/overview", { credentials: "include" })
            .then((res) => res.json())
            .then((res) => {
                resp = res;
                for (let li in res) {
                    overview  = `<li><details><summary>${Object.keys(res[li])}</summary>${temp[0].title}</details></li>`;
                }
                getid("dataList").innerHTML = overview;
                console.log(overview);
                console.log(temp[0]);
            })
            .then((getid("dataList").innerHTML = overview))
            .catch((err) => {
                console.log(err);
            });
</script>

CodePudding user response:

You need to parse the JSON.

JSON.parse(resp)

and then you can access it as a regular javascript object.

CodePudding user response:

According to your data structure you can access title as follows

resp[0]["4-13-2022"]["8:28:53 PM"].title

or you can use Object.values to get the first Property

Object.values((Object.values(resp[0])[0]))[0].title

CodePudding user response:

You have bad data.

This:

let temp = [   { "8:28:53 PM": {
                     title: "one",
                     topic: "two",
                     details: "tree",
                     type: "thought",
                     },
               },
            ];

Should look more like this:

let temp = [   { timestamp: "8:28:53 PM",
                 data: {
                     title: "one",
                     topic: "two",
                     details: "tree",
                     type: "thought",
                     },
               },
            ];

console.log(temp[0].data.title);

or even this:

let temp = [   { timestamp: "8:28:53 PM",
                 title: "one",
                 topic: "two",
                 details: "tree",
                 type: "thought"
               },
            ];

console.log(temp[0].title);

CodePudding user response:

try this

var title=resp[0]["4-13-2022"]["8:28:53 PM"].title; // one

CodePudding user response:

You can use destructuring as follows:

const resp = [ { "4-13-2022": { "8:28:53 PM": { "title": "one", "topic": "two", "details": "tree", "type": "thought" } } } ];

const [{"4-13-2022":{"8:28:53 PM":{title}}}] = resp;
//To get all the other properties, just list them with title:
//const [{"4-13-2022":{"8:28:53 PM":{title,topic,details,type}}}] = resp;

console.log( title );

If you have more than one element in the resp array, it's difficult to iterate through the items(elements) and get the desired properties, but it can be done.

const resp = [ { "4-13-2022": { "8:28:53 PM": { "title": "one", "topic": "two", "details": "tree", "type": "thought" } } },{ "4-13-2022": { "8:32:20 PM": { "title": "two", "topic": "five", "details": "six", "type": "watch out" } } },{ "4-14-2022": { "8:28:53 PM": { "title": "thirty", "topic": "tomorrow", "details": "never", "type": "comes" } } } ];

for(const [[date,[[time,{title,topic,details,type}]]]] of 
        resp.map(r => Object.entries(r).map(([d,v]) => 
            [d,Object.entries(v)])) ) {
    console.log( date,time,title,topic,details,type );
    //do something ....
}

But as you can see this is quite involved. If you have control of the backend I would suggest changing the structure of your data to something like or something simpler:

let resp = [
{
    "date": "4-13-2022",
    "time": "8:28:53 PM",
    "title": "one",
    "topic": "two",
    "details": "tree",
    "type": "thought"
}]

CodePudding user response:

You can use Object.keys(resp) to find the first key in resp. Then you can use Object.keys again on the inner object.

const dateKey = Object.keys(resp)[0];
const inner = resp[dateKey];
const timeKey = Object.keys(inner)[0];
const title = inner[timeKey].title;
  • Related