从对象数组中获取特定属性

时间:2019-10-31 07:10:13

标签: javascript vue.js ecmascript-6

我具有以下结构的JavaScript对象数组:

  let users = [{
    "id": 9,
    "name": "Sulaymon",
    "family": "Yahyaei",
    "email": "sulaymonhg@etlgr.com",
    "tel": "(91) 247-52-15",
    "isActive": 0,
    "level": "User",
    "email_verified_at": null,
    "created_at": "2019-10-30 04:56:18",
    "updated_at": "2019-10-30 04:56:18"
}, {
    "id": 8,
    "name": "Rasul",
    "family": "Irmatov",
    "email": "Rasul@etlgr.com",
    "tel": "(91) 524-57-96",
    "isActive": 0,
    "level": "User",
    "email_verified_at": null,
    "created_at": "2019-10-24 12:28:45",
    "updated_at": "2019-10-24 12:28:45"
}]

我是从Column对象中获取对象数组的

let columns = [
  {label: 'Name', name: 'name', show: true},
  {label: 'Family', name: 'family', show: true},
  {label: 'Email', name: 'email', show: true},
  {label: 'Telephone', name: 'tel', show: true},
  {label: 'Level', name: 'level', show: true},
  {label: 'Date Added', name: 'created_at', show: false},
  {label: 'Email Verification', name: 'email_verified_at',show: false},
  {label: 'Updated At', name: 'updated_at', show: false},
  {label: 'Status', name: 'isActive', show: false},
];

如果show属性应该为true,则获取它 结果应该是这样的:

let userData = [{
    "name": "Sulaymon",
    "family": "Yahyaei",
    "email": "sulaymonhg@etlgr.com",
    "tel": "(91) 247-52-15",
    "level": "User"
}, {
    "name": "Rasul",
    "family": "Irmatov",
    "email": "Rasul@etlgr.com",
    "tel": "(91) 524-57-96",
    "level": "User"
}]

我该怎么办?

3 个答案:

答案 0 :(得分:0)

let users = [{
    "id": 9,
    "name": "Sulaymon",
    "family": "Yahyaei",
    "email": "sulaymonhg@etlgr.com",
    "tel": "(91) 247-52-15",
    "isActive": 0,
    "level": "User",
    "email_verified_at": null,
    "created_at": "2019-10-30 04:56:18",
    "updated_at": "2019-10-30 04:56:18"
}, {
    "id": 8,
    "name": "Rasul",
    "family": "Irmatov",
    "email": "Rasul@etlgr.com",
    "tel": "(91) 524-57-96",
    "isActive": 0,
    "level": "User",
    "email_verified_at": null,
    "created_at": "2019-10-24 12:28:45",
    "updated_at": "2019-10-24 12:28:45"
}]

let columns = [
  {label: 'Name', name: 'name', show: true},
  {label: 'Family', name: 'family', show: true},
  {label: 'Email', name: 'email', show: true},
  {label: 'Telephone', name: 'tel', show: true},
  {label: 'Level', name: 'level', show: true},
  {label: 'Date Added', name: 'created_at', show: false},
  {label: 'Email Verification', name: 'email_verified_at',show: false},
  {label: 'Updated At', name: 'updated_at', show: false},
  {label: 'Status', name: 'isActive', show: false},
];

let userData = [];

users.forEach(user => {
  var obj = {};
  
  columns.forEach(col => {
    if (col.show) {
      obj[col.name] = user[col.name]
    }
  });
  userData.push(obj);
});

console.log(userData);

答案 1 :(得分:0)

您可以尝试使用mapfilter获得如下结果

let users = [{"id": 9,"name": "Sulaymon","family": "Yahyaei","email": "sulaymonhg@etlgr.com","tel": "(91) 247-52-15","isActive": 0,"level": "User","email_verified_at": null,"created_at": "2019-10-30 04:56:18","updated_at": "2019-10-30 04:56:18"}, {"id": 8,"name": "Rasul","family": "Irmatov","email": "Rasul@etlgr.com","tel": "(91) 524-57-96","isActive": 0,"level": "User","email_verified_at": null,"created_at": "2019-10-24 12:28:45","updated_at": "2019-10-24 12:28:45"}]
  , columnsToShow = [{label: 'Name', name: 'name', show: true},{label: 'Family', name: 'family', show: true},{label: 'Email', name: 'email', show: true},{label: 'Telephone', name: 'tel', show: true},{label: 'Level', name: 'level', show: true},{label: 'Date Added', name: 'created_at', show: false},{label: 'Email Verification', name: 'email_verified_at',show: false},{label: 'Updated At', name: 'updated_at', show: false},{label: 'Status', name: 'isActive', show: false},
                    ].filter(d => d.show).map(d => d.name)

let result = users.map(d => Object.assign(...columnsToShow.map(c => ({ [c]: d[c] }))))

console.log(result)

答案 2 :(得分:0)

let users = [{
    "id": 9,
    "name": "Sulaymon",
    "family": "Yahyaei",
    "email": "sulaymonhg@etlgr.com",
    "tel": "(91) 247-52-15",
    "isActive": 0,
    "level": "User",
    "email_verified_at": null,
    "created_at": "2019-10-30 04:56:18",
    "updated_at": "2019-10-30 04:56:18"
    },
    {
    "id": 8,
    "name": "Rasul",
    "family": "Irmatov",
    "email": "Rasul@etlgr.com",
    "tel": "(91) 524-57-96",
    "isActive": 0,
    "level": "User",
    "email_verified_at": null,
    "created_at": "2019-10-24 12:28:45",
    "updated_at": "2019-10-24 12:28:45"
    }];
let columns = [
  {label: 'Name', name: 'name', show: true},
  {label: 'Family', name: 'family', show: true},
  {label: 'Email', name: 'email', show: true},
  {label: 'Telephone', name: 'tel', show: true},
  {label: 'Level', name: 'level', show: true},
  {label: 'Date Added', name: 'created_at', show: false},
  {label: 'Email Verification', name: 'email_verified_at',show: false},
  {label: 'Updated At', name: 'updated_at', show: false},
  {label: 'Status', name: 'isActive', show: false},
];

users.map((user) => {
	return columns.filter(column => column.show).reduce((acc, column) => {
		acc[column.name] = user[column.name];
		return acc;
}, {});
})

相关问题