I've got two arrays, arr1 has the field and I need to take only the field value from it. The field value should be checked with the arr2 and if it matches the name of the key then need to create as the output below:

let arr1 = [{
      field: "name",
      value: "some1",
      value1: "some2"
    },{
      field: "job",
      value: "some1",
      value1: "some2"
    },{
      field: "from",
      value: "some1",
      value1: "some3"
    }
    ];
    
    let arr2 = [{
      name: "John",
      job: "engineer",
      address: "abc",
      from: "boston",
      gender: "male"
    },{
      name: "Steph",
      job: "worker",
      address: "uhuh",
      from: "uk",
      gender: "male"
    },{
      name: "dor",
      job: "farmer",
      address: "gdgs",
      from: "us",
      gender: "female"
    }
    ];

Needed Output:

[{
  name: "John",
  job: "engineer",
  from: "boston"
},{
  name: "Steph",
  job: "worker",
  from: "uk"
},{
  name: "Ram",
  job: "farmer",
  from: "us"
}
];

I tried doing this but I am getting only the last values in arr2.

for(let index = 0; index < arr2.length; index  ){
  for(let newi = 0; newi < arr1.length; newi  ){
    newObj = arr1[newi].field;
    final[newObj] = arr2[index][newObj]
    last.push(final[newObj])
   
  }
  console.log(last)
}

CodePudding user response：

Do it like this, using Array.map & Array.reduce

const arr1 = [{  field: "name",  value: "some1",  value1: "some2"},{  field: "job",  value: "some1",  value1: "some2"},{  field: "from",  value: "some1",  value1: "some3"}];
const arr2 = [{  name: "John",  job: "engineer",  address: "abc",  from: "boston",  gender: "male"},{  name: "Steph",  job: "worker",  address: "uhuh",  from: "uk",  gender: "male"},{  name: "dor",  job: "farmer",  address: "gdgs",  from: "us",  gender: "female"}];

const result = arr2.map(item => arr1.reduce((acc, {field}) => {
  acc[field] = item[field];
  return acc;
}, {}));

console.log(result);

<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>