從對象數組中獲取所有唯一對象屬性

Question

讓我們想象一下，我有一個對象數組，例如

 [{
    "firstName": "John",
    "lastName": "Doe"
 }, {
    "firstName": "Anna",
    "car": true
 }, {
    "firstName": "Peter",
    "lastName": "Jones"
 }]

我想從這個對象數組中獲取所有唯一的屬性名稱，因此結果將是：

[firstName, lastName, car]

我該怎么做：

我可以想象用這樣的東西做這件事是可能的：

function getPropertiesNames(obj){
  var arr = [];
  for(var name in obj) {
    if(arr.indexOf(name) != -1) arr.push(name);
  }
 return arr;
} 

為什么我需要它：

我將不得不制作一個包含多個對象的表格。 因為每個對象可能有點不同，我需要唯一的屬性名稱。 但是我要在angularJS中這樣做，所以對於我來說，一旦使用循環來獲取<th>屬性名稱並再次使用循環與<tr ng-repeat></tr>來顯示值，這是一個不好的選擇。

我想要的是：

是否有一些選項可以從一個對象數組中獲取所有唯一屬性名稱而無需迭代它？ 也許一些lodash或構建JS功能，我不知道？

Answer 1

僅使用的解決方案：

• Object.assign
• Object.keys
• Array.prototype.reduce

 var data = [{ "firstName": "John", "lastName": "Doe" }, { "firstName": "Anna", "car": true }, { "firstName": "Peter", "lastName": "Jones" }]; var uniqueKeys = Object.keys(data.reduce(function(result, obj) { return Object.assign(result, obj); }, {})) console.log(uniqueKeys); 

Answer 2

您可以使用map()和keys()返回每個對象的鍵，然后使用union()和flatten()

 var data = [{ "firstName": "John", "lastName": "Doe" }, { "firstName": "Anna", "car": true }, { "firstName": "Peter", "lastName": "Jones" }] var result = _.union(_.flatten(_.map(data, (e) => _.keys(e)))); console.log(result) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script> 

Answer 3

我不認為你可以遠離檢查每個對象中的每個鍵。 你可以用例如reduce來完成它：

var result = _.reduce(array, function(memory, obj) {
  for (var key in obj) {
    if(memory.indexOf(key) === -1) memory.push(key)
  }
  return memory;
}, []);

 var array = [{ "firstName": "John", "lastName": "Doe" }, { "firstName": "Anna", "car": true }, { "firstName": "Peter", "lastName": "Jones" }]; var result = _.reduce(array, function(memory, obj) { for (var key in obj) { if(memory.indexOf(key) === -1) memory.push(key) } return memory; }, []); console.log(result); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script> 

或者，您可以將密鑰存儲在新對象中，然后只提取密鑰：

var temp = _.reduce(array, function(memory, obj) {
  for (var key in obj) {
    memory[key] = null;
  }
  return memory;
}, {});
var result = Object.keys(temp);

 var array = [{ "firstName": "John", "lastName": "Doe" }, { "firstName": "Anna", "car": true }, { "firstName": "Peter", "lastName": "Jones" }]; var temp = _.reduce(array, function(memory, obj) { for (var key in obj) { memory[key] = null; } return memory; }, {}); var result = Object.keys(temp); console.log(result); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.15.0/lodash.min.js"></script> 

Answer 4

你可以用這個：

var result = [];
array.reduce( function(pre, item) {
    Object.keys(item).forEach(function(i){
        if (result.indexOf(i) === -1){
            result.push(i);
        }
    });
});

 var array = [{ "firstName": "John", "lastName": "Doe" }, { "firstName": "Anna", "car": true }, { "firstName": "Peter", "lastName": "Jones" }]; var result = []; array.reduce( function(pre, item) { Object.keys(item).forEach(function(i){ if (result.indexOf(i) === -1){ result.push(i); } }); }); console.log(result); 

Answer 5

你也可以試試這個：

var source = [{
"firstName": "John",
"lastName": "Doe"
 }, {
"firstName": "Anna",
"car": true
 }, {
"firstName": "Peter",
"lastName": "Jones"
 }];

uniq(source);

function uniq(source){
   var result = source.reduce(function(p, c) {

     Object.keys(c).forEach(function(key) {
         p[key] = true;
     });

     return p;
    }, {});

    return Object.keys(result);
}

Answer 6

我的解決方案沒有任何庫。

var array = [{
  "firstName": "John",
  "lastName": "Doe"
}, {
  "firstName": "Anna",
  "car": true
}, {
  "firstName": "Peter",
  "lastName": "Jones"
}];

var arr = [],merged,uniqArray;

array.forEach(function(val){ //Getting all properties
   arr.push(Object.keys(val))
 });

merged = [].concat.apply([], arr);//Merging all array to single array

merged.forEach(function(val){
  if(uniqArray.indexOf(val)== -1){// Getting uniqe values
   uniqArray.push(val)
}})

結果

["firstName", "lastName", "car"]

Answer 7

您可以使用Object.assign()和spread語法將對象數組合並到單個對象。 然后從合並對象中獲取密鑰：

Object.keys(Object.assign({}, ...array)) 

這是一個片段：

 const array = [{firstName:"John",lastName:"Doe"},{firstName:"Anna",car:true},{firstName:"Peter",lastName:"Jones"}], unique = Object.keys(Object.assign({}, ...array)) console.log(unique) 

---

另一種選擇是使用Object.keys作為flatMap回調。 這將返回所有鍵的數組。 然后，創建一個Set以獲取唯一鍵並使用Array.from()將該集轉換為數組。

const keys = input.flatMap(Object.keys),
      unique = Array.from(new Set(keys));

這是一個工作片段：

 const input=[{firstName:"John",lastName:"Doe"},{firstName:"Anna",car:true},{firstName:"Peter",lastName:"Jones"}], unique = Array.from(new Set(input.flatMap(Object.keys))); console.log(unique) 

如果不支持flatMap則可以使用

const keys = [].concat(...input.map(Object.keys)),

Answer 8

一個班輪選項：

[...new Set(a.map(Object.keys).reduce((a, b) => a.concat(b)))];

Answer 9

替代使用平板

 const arr = [{ "firstName": "John", "lastName": "Doe" }, { "firstName": "Anna", "car": true }, { "firstName": "Peter", "lastName": "Jones" }].map(obj => Object.getOwnPropertyNames(obj)).flat() const s = [...new Set(arr)] console.log(s)