如何从Javascript嵌套的对象数组中过滤和访问子元素

Question

我有以下对象数组，如果它符合外部条件，我想获得最里面的子属性:

我的条件应该是如果objArray.displayValue匹配"display2"并且它的types.displayValue匹配"inner_display4"然后返回它的值，即4。

objArray = [
{
"name": "abc",
"displayValue": "display1",
"types": [
{
"name": "name1",
"displayValue": "inner_display1",
"value": "1"
},
{
"name": "name2",
"displayValue": "inner_display2",
"value": "2"
},
{
"name": "name3",
"displayValue": "inner_display3",
"value": "3"
}
]
},
{
"name": "cdf",
"displayValue": "display2",
"types": [
{
"name": "name4",
"displayValue": "inner_display4",
"value": "4"
},
{
"name": "name5",
"displayValue": "inner_display5",
"value": "5"
},
{
"name": "name6",
"displayValue": "inner_display6",
"value": "6"
}
]
}
]

Answer 1

你可以试试这样

const find = (data, displayValue, innerDisplayValue) => 
data.reduce((res, item) => {
if(res || item.displayValue !== displayValue) return res
const type =  item.types.find(t => t.displayValue === innerDisplayValue)
return type? type.value: res
}, undefined)

const objArray = [{
"name": "abc",
"displayValue": "display1",
"types": [{
"name": "name1",
"displayValue": "inner_display1",
"value": "1"
}, {
"name": "name2",
"displayValue": "inner_display2",
"value": "2"
}, {
"name": "name3",
"displayValue": "inner_display3",
"value": "3"
}]
}, {
"name": "cdf",
"displayValue": "display2",
"types": [{
"name": "name4",
"displayValue": "inner_display4",
"value": "4"
}, {
"name": "name5",
"displayValue": "inner_display5",
"value": "5"
}, {
"name": "name6",
"displayValue": "inner_display6",
"value": "6"
}]
}]
console.log(find(objArray, 'display2', 'inner_display4'))
console.log(find(objArray, 'display2', 'inner_display40'))

Answer 2

您可以尝试以下操作:

首先找到具有正确displayValue的对象，然后过滤类型以返回您正在寻找的对象。一旦有了正确的类型对象，就解构该值。

constdisplayValue是你的结果

希望代码清楚一点:)

const findByDisplayValue = (dv) => objArray.find((obj) => obj.displayValue === dv);
const { types } = findByDisplayValue('display2');
const getType = (typeValue) => types.filter((type) => type.displayValue === typeValue);
const [{ displayValue }] = getType('inner_display4');