如何比较JSON格式数组的VALUE和KEY来创建新数组？在 Angular 5

Question

这是我的第一个 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) 中存在的 VALUE 和第二个数组中存在的 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"},
];

Answer 1

使用 .map 将所有字段名称存储在变量 keys 中。然后遍历原始数组并创建一个具有 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)
});

Working Demo

Answer 2

使用 .map() 从 columnNames 数组中的每个对象中获取字段。然后，将 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 */

Answer 3

您可以 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 是将键值对列表转换为对象的方法。

下一行表示我们filter()allProperies数组基于columnNames数组。

some() 方法 returns true 如果 columnNames 的某些属性存在于 allProperties:

let filteredProperties = allProperties.filter(([k, v]) => 
     columnNames.some(cl => cl.field == k));

如何比较JSON格式数组的VALUE和KEY来创建新数组？在 Angular 5

How to compare the JSON format array VALUE and KEY to create a new array? in Angular 5

arrays

angular

comparison