How to get array based on same key value in javascript

Viewed 65

I have two object arrays obj1 and obj2, how to get the array that matches key color-size of obj1 and model of obj2

Below function works, is there alternative way to do

getArrayByModel(obj1,obj2){
 return obj2.filter(o1 => obj1.some(o2 => o1.model=== (o2.color+ "-" + o2.size)));
}
console.log(this.getArrayByModel(obj1,obj2));
var obj1 = [
 { id:1, color:"blue",size:"m"}
]

var obj2 = [
 { idx:1, model:"blue-m", store:"111" },
 { idx:2, model:"blue-xs", store: "123"},
 { idx:3, model:"blue-m", store: "345"},
]

Expected Output

[
 { idx:1, model:"blue-m", store:"111" },
 { idx:3, model:"blue-m", store: "345"}
]

5 Answers
const getArrayByModel = (obj1,obj2) => obj2.filter(o1 => obj1.some(o2 => o1.model === [o2.color, o2.size].join('-')));

You can try to use map and filter methods like this:

var obj1 = [
 { id:1, color:"blue",size:"m"}
]

var obj2 = [
 { idx:1, model:"blue-m", store:"111" },
 { idx:2, model:"blue-xs", store: "123"},
 { idx:3, model:"blue-m", store: "345"},
]

var models = obj1.map(x => x.color + '-' + x.size);
var arr = obj2.filter(x => models.indexOf(x.model) > -1);

console.log(arr);

var obj1 = [
 { id:1, color:"blue", size:"m" },
 { id:2, color:"navy", size:"xl" }
]

var obj2 = [
 { idx:1, model:"blue-m", store:"111" },
 { idx:2, model:"blue-xs", store: "123"},
 { idx:3, model:"blue-m", store: "345"},
 { idx:4, model:"navy-xl", store: "456"},
]

var result = obj2.filter( ( {model, store} ) => {
  return obj1.map( ( {color, size} ) => [color, size].join("-")).includes( model );
} );

console.log(result);

Four alternatives, mostly overkill. But hey, you wanted to know if there were alternatives. The answer is yes. Don't try this at home ;)

const obj1 = [
 { id:1, color:"blue",size:"m"}
]

const obj2 = [
 { idx:1, model:"blue-m", store:"111" },
 { idx:2, model:"blue-xs", store: "123"},
 { idx:3, model:"blue-m", store: "345"},
]

// split to compare
const obj3 = obj2.filter(e => {
  let [color, model] = e.model.split("-");
  return obj1[0].color === color && obj1[0].size === model; 
});

// split to compare one liner
const obj3a = obj2.filter(e => 
  `${e.model.split("-")}` === `${[obj1[0].color, obj1[0].size]}`); 

// reduce
const obj4 = obj2.reduce( (a, e) => (
  `${a.compare.color}-${a.compare.size}` === e.model 
    ? {...a, found: [...a.found, e] }
    : a ), {compare: obj1[0], found: []} 
);

// using the 'thisArg' 
const obj5 = obj2.filter(
  function(e) { return e.model === this[0]; }, 
  [`${obj1[0].color}-${obj1[0].size}`]
);

console.log(JSON.stringify(obj3));
console.log(JSON.stringify(obj3a));
console.log(JSON.stringify(obj4.found));
console.log(JSON.stringify(obj5));

Thank you for giving me a deeper understanding of reduce. prev cannot be written in the inner function

var obj1 = [
    { id: 1, color: "blue", size: "m" }
]

var obj2 = [
    { idx: 1, model: "blue-m", store: "111" },
    { idx: 2, model: "blue-xs", store: "123" },
    { idx: 3, model: "blue-m", store: "345" },
]

function getArrayByModel(obj1, obj2) {
    const newObj1 = JSON.parse(JSON.stringify(obj1)),
        newObj2 = JSON.parse(JSON.stringify(obj2));

    return newObj1.reduce((prev, elem) =>
        prev.concat(newObj2.filter((item) =>
            item.model === `${elem.color}-${elem.size}` && elem
        ))
    , [])
}
console.log(getArrayByModel(obj1, obj2));

Related