Efficient way to get all keys in an unorganized array of objects

Question

I want to get all the keys in an array of objects. Initially, I just grabbed the first object in the array and used:

var keys = Object.keys(tableData[0]); 

But when I looked closer to the data, I noticed that the first line does not contain all the necessary keys. In the following example, the third element contains all the keys, but you may have a case where getting all the keys requires combining several objects.

 var tableData = [ { first:"jeff", last:"doe", phone: "2891" }, { first:"sarah", phone:"this", county: "usa" } { first:"bob", last:"brown", county: "usa", phone: "23211" } ]; 

How can I get all the unique keys in an array of objects that will be efficient on a large scale?

Answer 1

You can use reduce() and Set to get the desired result.

 var array = [ { first:"jeff", last:"doe", phone: "2891" }, { first:"sarah", phone:"this", county: "usa" }, { first:"bob", last:"brown", county: "usa", phone: "23211" } ]; var keys = [...new Set(array.reduce(function(r, e) { r = r.concat(Object.keys(e)); return r; }, []))]; console.log(keys) 

Answer 2

You can simply do the following:

 var array = [ { first:"jeff", last:"doe", phone: "2891" }, { first:"sarah", phone:"this", county: "usa" }, { first:"bob", last:"brown", county: "usa", phone: "23211" } ]; var result = array.reduce((p,o) => Object.assign(p,Object.keys(o)),[]); console.log(result); 

According to a very legitimate comment, here is my following solution:

 var array = [ { first:"jeff", last:"doe", phone: "2891", moron: "me"}, { first:"sarah", phone:"this", county: "usa" }, { first:"bob", last:"brown", county: "usa", phone: "23211" } ]; var result = array.reduce((p,o) => p.concat(Object.keys(o).filter(k => !p.includes(k))),[]); console.log(result); 

Answer 3

You can use map() and Set :

 var arr = [ { first:"jeff", last:"doe", phone: "2891", something: "4" }, { first:"sarah", phone:"this", county: "usa" }, { first:"bob", last:"brown", county: "usa", phone: "23211", lastrow: "lr" } ]; var set = new Set(); arr.map(obj => { Object.keys(obj).forEach(el => { set.add(el); }); }); var res = [...set]; console.log(res); 

I tested console time in the Chrome browser from the code above with @Nenad Vracar and @Redu code :

 var array = [ { first:"jeff", last:"doe", phone: "2891", something: "4" }, { first:"sarah", phone:"this", county: "usa" }, { first:"bob", last:"brown", county: "usa", phone: "23211", lastrow: "lr" } ]; function f1(arr) { // Peter Leger var set = new Set(); arr.map(obj => { Object.keys(obj).forEach(el => { set.add(el); }); }); var res = [...set]; return res; } function f2(arr) { // Nenad Vracar var keys = [...new Set(arr.reduce(function(r, e) { r = r.concat(Object.keys(e)); return r; }, []))]; return keys; } function f3(arr) { // Redu var result = arr.reduce((p,o) => p.concat(Object.keys(o).filter(k => !p.includes(k))),[]); return result; } var iterations = 1000000; console.time('Function f1'); for(var i = 0; i < iterations; i++ ){ f1(array); }; console.timeEnd('Function f1') console.time('Function f2'); for(var i = 0; i < iterations; i++ ){ f2(array); }; console.timeEnd('Function f2') console.time('Function f3'); for(var i = 0; i < iterations; i++ ){ f3(array); }; console.timeEnd('Function f3') 

with the following results:

First result:

• Function f1: 6375.193ms
• F2 function: 6309.516ms
• Function f3: 6756.946ms

Second result:

• Function f1: 6152.040ms
• F2 function: 8004.565ms
• Function f3: 6885.656ms

The third result:

• Function f1: 5918.497ms
• F2 function: 8136.073ms
• Function f3: 7111.273ms