如何在对象内的对象数组中检索特定键值？

Question

我有一个数组 originalArrayData 像这样：

扩展：

第一个数组项的值，它是一个对象，是几个对象。 数组第一部分的内容示例如下：

originalArrayData = [{
    "16": {
        "id": 22,
        "grid_row_id": 5,
        "grid_col_id": 16,
        "data": "10",
        "created_at": "rertte",
        "error_mgs": null
    },
    "header": "Row 2",
    "id": 5
},
{
    "17": {
        "id": 31,
        "grid_row_id": 9,
        "grid_col_id": 17,
        "data": "14",
        "created_at": "rtyhtyjtdyj",
        "error_mgs": null
    },
    "header": "Row 1",
    "id": 6
},
{
    "18": {
        "id": 35,
        "grid_row_id": 9,
        "grid_col_id": 12,
        "data": "55",
        "created_at": "thrtuhrs",
        "error_mgs": null
    },
    "header": "Row 1",
    "id": 6
}...........

假设我有一个 id 数组（这些数字可能是随机的，并不总是 2。可能有 1、3 等数组项）

arrayOfIds: [16 , 17]

如果 grid_col_id 的值存在于 arrayOfIds 中的任何位置，我如何从每个对象中检索“数据”值并将其放入自己的数组中？

我知道如何从数组中的每个第一个对象中检索所有 id 的数组：

let data = this.arrayList.map((obj) => obj.id);

以上产生：[5,6,7,8,9]。 但是，现在我正在尝试的是正确的。 到目前为止，我有以下内容：

var targetArr = []

this.originalArrayData.forEach(item=> {
    item.forEach(ins => {
        if(arrayOfIds.includes(ins.grid_col_id)
            targetArr.push(ins.data)
    })
})

这会产生一个错误： TypeError: row.forEach is not a function

我的目标是：[10, 14, ...]

目标包含 10 和 14，因为如果您查看 originalArrayData，如果 grid_col_id 在 arrayOfIds: [16 , 17] 内，那么我们检索“数据”值并将其放入新数组中。

如何实现目标数组？

Answer 1

干得好：

 const input=[{"16":{id:22,grid_row_id:5,grid_col_id:16,data:"10",created_at:"rertte",error_mgs:null},header:"Row 2",id:5},{"17":{id:31,grid_row_id:9,grid_col_id:17,data:"14",created_at:"rtyhtyjtdyj",error_mgs:null},header:"Row 1",id:6},{"18":{id:35,grid_row_id:9,grid_col_id:12,data:"55",created_at:"thrtuhrs",error_mgs:null},header:"Row 1",id:6}]; const arrayOfIds = [16 , 17]; const format = (array) => { return array.reduce((result, el) => { const key = Object.keys(el).find((key) => 'object' === typeof el[key]); if(arrayOfIds.includes(+key)){ result.push(+el[key].data); } return result; }, []); }; console.log(format(input));

Answer 2

您可以执行以下操作。 解释见代码中的注释

 let od = [{ "16": { "id": 22, "grid_row_id": 5, "grid_col_id": 16, "data": "10", "created_at": "rertte", "error_mgs": null }, "header": "Row 2", "id": 5 }, { "17": { "id": 31, "grid_row_id": 9, "grid_col_id": 17, "data": "14", "created_at": "rtyhtyjtdyj", "error_mgs": null }, "header": "Row 1", "id": 6 }, { "18": { "id": 35, "grid_row_id": 9, "grid_col_id": 12, "data": "55", "created_at": "thrtuhrs", "error_mgs": null }, "header": "Row 1", "id": 6 }] let filter = [16, 17]; //transform the original data into a flat array of objects let dd = od.map(x => //all property values of the object Object.values(x) //which are an object (ie filter away primitve types .filter(y => typeof y === "object")) //flatten the array of arrays .flat() let result = dd //filter the list of objects for the ids in the filter .filter(x => filter.includes(x.grid_col_id)) //and get only the data property .map(x => x.data) console.log(result);

Answer 3

这是一个更类似于您最初尝试的替代方案。

您可以使用Object.keys 、 Object.hasOwn和Array.prototype.find来获取带有 grid_col_id 的属性的键：

 const originalArrayData = [{ "16": { "id": 22, "grid_row_id": 5, "grid_col_id": 16, "data": "10", }, "header": "Row 2", "id": 5 }, { "17": { "id": 31, "grid_row_id": 9, "grid_col_id": 17, "data": "14", }, "header": "Row 1", "id": 6 }, { "18": { "id": 35, "grid_row_id": 9, "grid_col_id": 12, "data": "55", }, "header": "Row 1", "id": 6 }] const arrayOfIds = [16, 17] const targetArr = [] originalArrayData.forEach(d => { const keyOfObjectWithGridCol = // Get all keys of the object as an array Object.keys(d) // Get the key of the nested object that has grid_col_id .find(key => Object.hasOwn(d[key], 'grid_col_id')) // Find property if (arrayOfIds.includes(d[keyOfObjectWithGridCol].grid_col_id)) { targetArr.push(d[keyOfObjectWithGridCol].data) } }) console.log(targetArr) // [10, 14]