I am trying to extract and push the elements from an array of object to an empty object. Here is the example of the arrays.
const products = ["cars", "phones", "laptops"];
const productArrayOfObj = [
{
cars: ["Ford", "Chevy", "Honda", "Toyota"],
},
{
phones: ["iPhone", "Samsung", "Nokia", "Sony"],
},
{
laptops: ["Mac", "Dell", "HP", "Acer"],
},
];
const mappedProducts= products.map((_,i) => productArrayOfObj[i]);
From mappedProducts returns this structure, even though I am not sure if this is the correct way of mapping this.
[ { cars: [ 'Ford', 'Chevy', 'Honda', 'Toyota' ] },
{ phones: [ 'iPhone', 'Samsung', 'Nokia', 'Sony' ] },
{ laptops: [ 'Mac', 'Dell', 'HP', 'Acer' ] } ]
My desired array would look like this
[ 'Ford', 'Chevy', 'Honda', 'Toyota','iPhone', 'Samsung', 'Nokia',
'Sony','Mac', 'Dell', 'HP', 'Acer' ]
The way I'm trying to implement it, returns wrong result.
const arrayToPush = []
const getArrayEl = mappedProducts && mappedProducts.map(item => {
for(let key in item){
arrayToPush.push(item[key])
}
return arrayToPush
})
Any help will be appreciated
const names = ["cars", "phones", "laptops"];
const nameArrayOfObj = [
{
cars: ["Ford", "Chevy", "Honda", "Toyota"],
},
{
phones: ["iPhone", "Samsung", "Nokia", "Sony"],
},
{
laptops: ["Mac", "Dell", "HP", "Acer"],
},
];
const mappedProducts = names && nameArrayOfObj && names.map((_,i) => nameArrayOfObj[i]);
console.log("mappedProducts", mappedProducts);
const arrayToPush = []
const getArrayEl = mappedProducts && mappedProducts.map(item => {
for(let key in item){
arrayToPush.push(item[key])
}
return arrayToPush
})
console.log("getArrayEl", getArrayEl);
You could use two .flatMap() calls, to loop through your array of product objects, and then an inner one to loop through your names from the products array. For each name, you can take the associated array from the object at that name:
const products = ["cars", "phones", "laptops"];
const productArrayOfObj = [ { cars: ["Ford", "Chevy", "Honda", "Toyota"], }, { phones: ["iPhone", "Samsung", "Nokia", "Sony"], }, { laptops: ["Mac", "Dell", "HP", "Acer"], }, ];
const res = productArrayOfObj.flatMap(obj => products.flatMap(
name => obj[name] ?? []
));
console.log(res);
If your objects can only contain one key-array pair, then you can change your inner .flatMap() to a .find() to find the key being used in the object:
const products = ["cars", "phones", "laptops"];
const productArrayOfObj = [ { cars: ["Ford", "Chevy", "Honda", "Toyota"], }, { phones: ["iPhone", "Samsung", "Nokia", "Sony"], }, { laptops: ["Mac", "Dell", "HP", "Acer"], }, ];
const res = productArrayOfObj.flatMap(obj => {
const key = products.find(name => obj.hasOwnProperty(name));
return key ? obj[key] : [];
});
console.log(res);
Array.flatMap implementation.
Logic
names array with Array.flatMap.nameArrayOfObj.This implementation makes use of an asumprion that both arrays are in same order.
Working Fiddle
const names = ["cars", "phones", "laptops"];
const nameArrayOfObj = [
{ cars: ["Ford", "Chevy", "Honda", "Toyota"] },
{ phones: ["iPhone", "Samsung", "Nokia", "Sony"] },
{ laptops: ["Mac", "Dell", "HP", "Acer"] },
];
const mappedProducts = names.flatMap((name, i) => nameArrayOfObj[i][name] ? nameArrayOfObj[i][name] : []);
console.log(mappedProducts);
If you cannot ensure the arrays ae in same order, you can make use of this logic.
names Array.nameArrayOfObj array with the key in names Array.Working Fiddle
const names = ["cars", "phones", "laptops"];
const nameArrayOfObj = [
{ cars: ["Ford", "Chevy", "Honda", "Toyota"] },
{ phones: ["iPhone", "Samsung", "Nokia", "Sony"] },
{ laptops: ["Mac", "Dell", "HP", "Acer"] },
];
const mappedProducts = names.flatMap((name, i) => {
const matchingNode = nameArrayOfObj.find(item => item.hasOwnProperty(name));
return matchingNode ? matchingNode[name] : [];
});
console.log(mappedProducts);
Is this your solution? Using the keys from products and flatMap()
const products = ["cars", "phones", "laptops"];
const productArrayOfObj = [
{
cars: ["Ford", "Chevy", "Honda", "Toyota"],
},
{
phones: ["iPhone", "Samsung", "Nokia", "Sony"],
},
{
laptops: ["Mac", "Dell", "HP", "Acer"],
},
];
const mappedProducts= products.flatMap((_,i) => productArrayOfObj[i][_]);
console.log(mappedProducts)