我想根据相似对象数组中的键动态创建对象值数组

Question

Here's my JavaScript array of objects:

inventoryArray = [
    {name: 'pizza', category: 'food', unique: 'no', amount: 12}
    {name: 'bow', category: 'weapon', unique: 'no', amount: 1}
    {name: 'pizza', category: 'food', unique: 'yes', amount: 1}
]

They all have the same keys and most have different values.

I want to create an array of values based on keys dynamically that looks like this:

values = [
    ['pizza', 'bow', 'pizza'] // name
    ['food', 'weapon', 'food'] // category
    ['no', 'no', 'yes'] //unique
    [12, 1, 1] // amount
    // TODO only add distinct values:
    // i.e. first array would be ['pizza', 'bow']
]

Closest I've gotten is:

const keys = [];
const values = [];
for(let i = 0; i < inventoryArray.length; i++){
    keys[i] = Object.keys(inventoryArray[i]);
}
for(let i = 0; i < keys[0].length; i++) {
    const value = [];
    for(let j = 0; j < inventoryArray.length; j++) {            
        value[j] = inventoryArray[j][keys[j][i]];
    }
    values[i] = value;
}

Yeah, I know it's ugly.

That keys[0] in the second for loop is not really dynamic. Right?

I'm still pretty new at JavaScript and I tried playing around with the map method for arrays, but couldn't get it to create them all dynamically. Just one by one:

const names = inventoryArray.map(a => a.name);

Thanks in advance!

Answer 1

Create an array of the props you want in the correct order. Use nested Array.map() calls to create the matrix. You can use a Set , to make the values distinct.

 const inventoryArray = [{"name":"pizza","category":"food","unique":"no","amount":12},{"name":"bow","category":"weapon","unique":"no","amount":1},{"name":"pizza","category":"food","unique":"yes","amount":1}] const props = ['name', 'category', 'unique', 'amount'] const result = props.map(p => [...new Set(inventoryArray.map(o => o[p]))] ) console.log(result)