Выведите массив из значений другого массива

Question

у меня есть эта продукция массив в угловом 2 компоненте:

products = [{name: "product1", product_properties: [{name: "color", value: "blue"}, {name: "size", value: "small"}]}, 
      {name: "product2", product_properties: [{name: "color", value: "yellow"}, {name: "size", value: "medium"]}, 
      {name: "product3", product_properties: [{name: "color", value: "green"}, {name: "size", value: "large"}, 
      {name: "product4", product_properties: [{name: "color", value: "green"}, {name: "size", value: "small"}]} 
      {name: "product5", product_properties: [{name: "color", value: "yellow"}, {name: "size", value: "medium"}] 

Что является наиболее эффективным способом петли над этим массивом и получить массив, который выглядит, как показано ниже используя машинописный или JavaScript:

derivedArray = [{property_name: "color", values: ["blue", "yellow", "green"]}, 
       {property_name: "size", values: ["small", "medium", "large"]}] 

Answer 1

Ваш массив имеет некоторые синтаксические ошибки, исправить их:

var inData = [ 
    {name: "product1", product_properties:[{name: "color", value: "blue"}, {name: "size", value: "small"} ]}, 
    {name: "product2", product_properties:[{name: "color", value: "yellow"}, {name: "size", value: "medium"}]}, 
    {name: "product3", product_properties:[{name: "color", value: "green"}, {name: "size", value: "large"}]} 
]; 

Давайте строить HashMap из property => values:

var hash = inData.reduce((acc, p) => { 
    p.product_properties.forEach(prop => { 
    if (!acc[prop.name]) acc[prop.name] = []; 
    if (!~acc[prop.name].indexOf(prop.value)) // filter duplicates 
     acc[prop.name].push(prop.value);}); 
    return acc; 
}, {}); 

А теперь строить запрошенную структуру данных:

Object.keys(hash).map(key => ({property_name: key, values: hash[key]})) 

Результат:

[ 
    {"property_name":"color","values":["blue","yellow","green"]},  
    {"property_name":"size","values":["small","medium","large"]} 
] 

Answer 2

Использование JQuery

var products = [{name: "product1", product_properties: [{name: "color", value: "blue"}, {name: "size", value: "small"}]}, 
 
      {name: "product2", product_properties: [{name: "color", value: "yellow"}, {name: "size", value: "medium"}]}, 
 
      {name: "product3", product_properties: [{name: "color", value: "green"}, {name: "size", value: "large"}]}]; 
 
var colorArray = []; 
 
var sizeArray = []; 
 
$.each(products,function(i,v){ 
 
var colorAttributes = v.product_properties[0]; 
 
var sizeAttributes = v.product_properties[1]; 
 
// check if attribute is already passed in the array using jQuery.inArray() 
 
if(colorAttributes.name=="color" && $.inArray(colorAttributes.value,colorArray)==-1){ 
 
colorArray.push(colorAttributes.value); 
 
} 
 
if(sizeAttributes.name=="size" && $.inArray(sizeAttributes.value,sizeArray)==-1){ 
 
sizeArray.push(sizeAttributes.value); 
 
} 
 
}); 
 
var derivedArray = [{property_name: "color", values: colorArray}, 
 
       {property_name: "size", values: sizeArray}] ; 
 
alert(JSON.stringify(derivedArray));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>