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;