Get objects in array on property and with specific value of key

Question

I need to find all objects of array, which contain color "green" in "mode" property.

 let arr = [ { "type": "One", "mode": [{ "color": "blue", "size": "L" } ] }, { "type": "Two", "mode": [{ "color": "green", "size": "M" } ] },{ "type": "Three", "mode": [{ "color": "green", "size": "L" } ] },{ "type": "Four", "mode": [{ "color": "red", "size": "XS" } ] } ]; let result = arr.indexOf(arr.find(function(el,index){ return el['mode'][0].color === 'green'; })) console.log(result);

Currently I can only get the index.

I would like to get something like this in the output:

     [
       {
        "type": "Two",
        "mode": [{ 
            "color": "green", 
            "size": "M"
          }
        ]
      },{
        "type": "Three",
        "mode": [{ 
            "color": "green", 
            "size": "L"
          }
        ]
      }
    ]

Answer 1

Use Array.prototype.filter and Array.prototype.some to search the inner array

 const filterByModeColor = (arr, color) => arr.filter(ob => ob.mode?.some(o => o.color == color)); const myArr = [ {"type": "One", "mode": [{"color": "blue", "size": "L"}]}, {"type": "Two", "mode": [{"color": "green", "size": "M"}]}, {"type": "Three", "mode": [{"color": "green", "size": "L"}]}, {"type": "Four", "mode": [{"color": "red", "size": "XS"}]} ]; const filtered = filterByModeColor(myArr, "green"); console.log(filtered);

To additionally filter the inner "mode": arrays use Array.prototype.reduce instead.

 const filterByModeColor = (arr, color) => arr.reduce((acc, obj) => { const mode = obj.mode.filter(o => o.color === color); mode.length && acc.push({...obj, mode}); return acc; }, []); const myArr = [ {"type": "One", "mode": [{"color": "blue", "size": "L"}, {"color": "green", "size": "L"}]}, {"type": "Two", "mode": [{"color": "green", "size": "S"}, {"color": "green", "size": "M"}, {"color": "red", "size": "Xl"}]}, {"type": "Three", "mode": [{"color": "yellow", "size": "L"}, {"color": "blue", "size": "XL"}]}, {"type": "Four", "mode": [{"color": "red", "size": "XS"}]} ]; const filtered = filterByModeColor(myArr, "green"); console.log(filtered);

Answer 2

The best approach is to use two array methods: filter and some .

filter allows you to iterate over the data array and return only those objects that match a certain condition. In this case it's whether any of the objects in the mode array has the color "green".

 let arr=[{type:"One",mode:[{color:"blue",size:"L"}]},{type:"Two",mode:[{color:"green",size:"M"}]},{type:"Three",mode:[{color:"green",size:"L"}]},{type:"Four",mode:[{color:"red",size:"XS"}]}]; // Iterate over the array of objects const result = arr.filter(obj => { // If some of the objects in the `mode` array // have a color property with the value green // return `true` - and that object will be returned // by `filter` return obj.mode.some(m => m.color === 'green'); }); console.log(result);