Как сравнить массив значений JSON VALUE и KEY для создания нового массива? в угловых 5

10

Вот мой первый формат массива JSON:

this.columnNames = [
  {field : "Name"},
  {field : "Address"},
  {field : "Age"}
];

Вот мой первый формат массива JSON:

this.rowData = [
  {Name : "Praveen",Address : "aiff",Age : "12",w :  "1",e :  "8"},
  {Name : "Akashay",Address : "xvn",Age : "15",w :  "2",e :  "7"},
  {Name : "Bala",Address : "hjk",Age : "16",w :  "3",e :  "6"}, 
  {Name : "Charu",Address : "sss",Age : "17",w :  "4",e :  "5"},
];  

Здесь я хочу сравнить ЗНАЧЕНИЕ, которое присутствует в первом array(columnNames)и KEYS, которое присутствует во втором массиве. Если он равен, то я хочу перенести эти совпадающие данные со второго array(rowData)в новый массив.

И я хочу, чтобы мой конечный результат был таким:

public rowData: any =[
  {Name : "Praveen",Address : "aiff",Age : "12"},
  {Name : "Akashay",Address : "xvn",Age : "15"},
  {Name : "Bala",Address : "hjk",Age : "16"}, 
  {Name : "Charu",Address : "sss",Age : "17"},
];
Правин Сиванадияр
источник
Вы пытались сделать это самостоятельно?
TylerH

Ответы:

10

Захватите поля из каждого объекта в вашем columnNamesмассиве, используя .map(). Затем сопоставьте каждый объект rowDataновому объекту, созданному с использованием .reduce(), который включает только ключи из вашего fieldsмассива:

const columnNames = [
  {field : "Name"},
  {field : "Address"},
  {field : "Age"}
];

const rowData = [
  {Name : "Praveen",Address : "aiff",Age : "12",w :  "1",e :  "8"},
  {Name : "Akashay",Address : "xvn",Age : "15",w :  "2",e :  "7"},
  {Name : "Bala",Address : "hjk",Age : "16",w :  "3",e :  "6"}, 
  {Name : "Charu",Address : "sss",Age : "17",w :  "4",e :  "5"},
];  

const fields = columnNames.map(({field}) => field); // get array ["Name", "Address", "Age"]
const result = rowData.map( // map each object in rowData to a new object
  o => fields.reduce((obj, k) => ({...obj, [k]: o[k]}), {})
  //    ^^ construct the new object, using reduce, spread syntax and computed property names
);

console.log(result);
.as-console-wrapper { max-height: 100% !important;} /* ignore */

Если вы можете поддерживать Object.fromEntries()(который берет массив вложенных [key, value]пар и строит из них объект), тогда нет необходимости использовать .reduce():

const columnNames = [
  {field : "Name"},
  {field : "Address"},
  {field : "Age"}
];

const rowData = [
  {Name : "Praveen",Address : "aiff",Age : "12",w :  "1",e :  "8"},
  {Name : "Akashay",Address : "xvn",Age : "15",w :  "2",e :  "7"},
  {Name : "Bala",Address : "hjk",Age : "16",w :  "3",e :  "6"}, 
  {Name : "Charu",Address : "sss",Age : "17",w :  "4",e :  "5"},
];  

const fields = columnNames.map(({field}) => field);
const result = rowData.map( 
  o => Object.fromEntries(fields.map(k => [k, o[k]]))
);

console.log(result);
.as-console-wrapper { max-height: 100% !important;} /* ignore */

Ник Парсонс
источник
Привет у меня проблема Не могли бы вы решить мою проблему? :) Вот ссылка [ stackoverflow.com/questions/60089217/…
Sakkeer A
5

Вы можете filterнастроить свойства вашего объекта на основе columnNamesмассива, а затем просто создать объект, используя Object.fromEntries:

const result = rowData.map(s => Object.fromEntries(
    Object.entries(s).filter(([k, v]) => columnNames.some(cl => cl.field == k))));

Пример:

let columnNames = [
  {field : "Name"},
  {field : "Address"},
  {field : "Age"}
];

let rowData = [
  {Name : "Praveen",Address : "aiff",Age : "12",w :  "1",e :  "8"},
  {Name : "Akashay",Address : "xvn",Age : "15",w :  "2",e :  "7"},
  {Name : "Bala",Address : "hjk",Age : "16",w :  "3",e :  "6"},
  {Name : "Charu",Address : "sss",Age : "17",w :  "4",e :  "5"},
];

const result = rowData.map(s => Object.fromEntries(
    Object.entries(s).filter(([k, v]) => columnNames.some(cl => cl.field == k))));
console.log(result);

Или более отлаживаемая версия:

const result = rowData.map(s => {
  let allProperties = Object.entries(s);
  let filteredProperties = allProperties.filter(([k, v]) => 
      columnNames.some(cl => cl.field == k));
  let result = Object.fromEntries(filteredProperties);
  return result;
})

Пример:

let columnNames = [
  {field : "Name"},
  {field : "Address"},
  {field : "Age"}
];

let rowData = [
  {Name : "Praveen",Address : "aiff",Age : "12",w :  "1",e :  "8"},
  {Name : "Akashay",Address : "xvn",Age : "15",w :  "2",e :  "7"},
  {Name : "Bala",Address : "hjk",Age : "16",w :  "3",e :  "6"},
  {Name : "Charu",Address : "sss",Age : "17",w :  "4",e :  "5"},
];

const result = rowData.map(s => {
  let allProperties = Object.entries(s);
  let filteredProperties = allProperties.filter(([k, v]) => 
      columnNames.some(cl => cl.field == k));
  let result = Object.fromEntries(filteredProperties);
  return result;
})

Object.fromEntries - это метод, который преобразует список пар ключ-значение в объект.

Следующая строка означает, что мы фильтруем () allProperies массив на основе columnNamesмассива.

Метод some () возвращает, trueесли какое-либо свойство columnNamesсуществует в allProperties:

let filteredProperties = allProperties.filter(([k, v]) => 
     columnNames.some(cl => cl.field == k)); 
стартап
источник
Большое вам спасибо за ваш ответ. я сомневаюсь в этом, я новичок в angular 8, я точно не знаю, что такое «Object.fromEntries», а также вы можете объяснить это, например, «let FilterProperties = allProperties.filter (([k, v]) => columnNames.some (cl => cl.field == k)); ". Спасибо тебе в аватансе!
Правин Сиванадияр
@PraveenSivanadiyar, пожалуйста, смотрите мой обновленный ответ
Шаг
Привет, у меня есть проблема. Не могли бы вы решить мою проблему? :) Вот ссылка [ stackoverflow.com/questions/60089217/…
Sakkeer A
3

Сохраните все имена полей в переменной, keysиспользуя .map . Затем переберите исходный массив и создайте объект со свойствами, присутствующими вkeys

Попробуйте вот так:

let keys = this.columnNames.map(x => x.field);

this.rowData.forEach(item => {
  let obj = {}
  keys.forEach(key => {
    obj[key] = item[key]
  });
  this.result.push(obj)
});

Рабочая Демо

Адрита Шарма
источник
Можете ли вы объяснить, что здесь будет происходить? keys.forEach (key => {obj [key] = item [key]});
Правин Сиванадияр
Конечно, я добавляю описание
Адрита Шарма
@PraveenSivanadiyar Добавлено описание. дайте мне знать, если это было полезно
Адрита Шарма
1
objэто новый пустой объект. obj[key] = item[key] означает, что в первом цикле ключом является «Имя», таким obj[key]будет {Name: }и item.Nameбудет Praveen, {Name: "Praveen" }
таков
Да, теперь я понимаю, и это прекрасно работает с моим кодом. Большое спасибо @Adrita Sharma.
Правин Сиванадияр