如何根据对象数组中的键获取值 javascript

问题描述

我有一个从数据库中获取的数组，如下所示

var sampleArray = 
{ID:1,ANALYSIS_NAME : "name1",custodians:"[{\"ID\": 1,\"NAME\": \"abc\"},{\"ID\": 2,\"NAME\": \"xyz\"},{\"ID\": 3,\"NAME\": \"pqr\"}]"

};

如何从上述数组中获取名称。我可以显示 console.log(sampleArray.custodians) 但是当我尝试显示 console.log(sampleArray.custodians.name) 时出现错误 Cannot read property 'NAME' of undefined。

return(<div>
<Panel>test</panel>
/*custodians should come here*/
</div>)

如何显示上述对象？请帮忙。提前致谢

解决方法

部分问题是因为 sampleArray.custodians 是 JSON 格式的字符串。在访问它之前，您需要对其进行反序列化。

问题的另一部分是反序列化的结果会将 custodians 转换为数组，因此您需要通过索引或循环直接访问它。

var sampleArray = {
  ID: 1,ANALYSIS_NAME: "name1",custodians: "[{\"ID\": 1,\"NAME\": \"abc\"},{\"ID\": 2,\"NAME\": \"xyz\"},{\"ID\": 3,\"NAME\": \"pqr\"}]"
};

let custodians = JSON.parse(sampleArray.custodians);

custodians.forEach(c => console.log('loop',c.NAME)); // loop

console.log('index',custodians[0].NAME); // direct access by index

-- 更新 --

根据您的问题的更新，您可以使用 map() 构建 HTML 字符串以从您的函数返回：

var sampleArray = {
  ID: 1,\"NAME\": \"pqr\"}]"
};


let buildCustodianHtml = (data) => {
  let custodianHtml = JSON.parse(data.custodians).map(c => `<p>${c.NAME}</p>`).join('');
  return `<div><Panel>test</panel>${custodianHtml}</div>`;
}

$('#container').append(buildCustodianHtml(sampleArray));

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container"></div>

,

custodians 属性是一个字符串。您首先需要使用

将此字符串转换为JSON

var custodians = JSON.parse(sampleArray.custodians);

然后您可以使用

访问它

console.log(custodians[0].NAME)

,

由于custodians是一个字符串，所以需要先转换成对象才能访问“NAME”。

使用 JavaScript 的内置 JSON.Parse()

var sampleArray = 
    {
    ID:1,ANALYSIS_NAME : "name1",custodians:`[{\"ID\": 1,\"NAME\": \"pqr\"}]`

};

let newObj = JSON.parse(sampleArray.custodians);

for(let i=0; i<newObj.length; i++){
    console.log(`Name: ${newObj[i]["NAME"]}`);
}