elegant code to extract a subset array from an object array?

Question

Given the following object array:

var myObject =
[
{X:1, Y:2, Z:3},
{X:4, Y:5, Z:6},
{X:7, Y:8, Z:9},
]

What is some elegant code to get the following output?:

var subset = [ Y:2, Y:5, Y:8 ]

var subset = [ Y:2, Y:5, Y:8 ] is invalid syntax. Do you mean: var subset = { Y1:2, Y2:5, Y3:8 } or do you mean: var subset = [ { Y:2 }, { Y:5 }, { Y:8 } ]? SInce the first one will use array.reduce() and the second will use array.map() — Shilly
– Shilly, Commented Dec 20, 2017 at 13:35
@Shilly note that your first subset is also wrong, as your declaring the same key multiple times. It's almost certainly the second. — Jared Smith
– Jared Smith, Commented Dec 20, 2017 at 13:38
@Jared Smith Yeah, I already editted it and added a number to the keys. Noticed myself 10sec after posting. — Shilly
– Shilly, Commented Dec 20, 2017 at 13:38

Jared Smith · Accepted Answer · 2017-12-20 13:41:19Z

6

const arr = [
  {X:1, Y:2, Z:3},
  {X:4, Y:5, Z:6},
  {X:7, Y:8, Z:9},
];
const output = arr.map(({Y}) => ({Y})); // [{Y: 2}, {Y: 5}, {Y: 8}]

This uses an arrow function mapped over the array, destructures the Y property out of each item, and uses object property shorthand to return a new object with just the Y property for each item of the array.

edited Dec 20, 2017 at 13:41

answered Dec 20, 2017 at 13:39

Jared Smith

22.3k5 gold badges50 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Jared Smith Over a year ago

@T.J.Crowder I just had to write a similar answer to a related but different question yesterday, so I had it fresh in my head :)

Adrien Brunelat Over a year ago

That may be personal taste, but I find this syntax highly disturbing and hard to read (maybe lack of experience with decomposition?). This is a very good answer though and maybe the most JS answer here.

Jared Smith Over a year ago

@AdrienBrunelat thank you, I went for maximum brevity (OP requested eloquence). A perhaps more readable version would be T.J. Crowder's although both need the extra parens so the braces don't get mistaken for a function body instead of an object by the parser.

T.J. Crowder Over a year ago

@AdrienBrunelat: ("Destructuring") Yeah, it can really throw you at first glance -- and second glance, and third. :-) Once you get used to it it's powerful, but like any power, it can be abused. The symmetry is fun, though.

Jared Smith Over a year ago

@T.J.Crowder it would be really cryptic if they let you automagically return the destructured item. But would a hypothetical arr.map(({Y})); return the value of Y or {Y:Y}? Enquiring minds want to know...

|

T.J. Crowder · Accepted Answer · 2017-12-20 13:38:25Z

4

map with an arrow function is fairly elegant:

var myObject =
[
{X:1, Y:2, Z:3},
{X:4, Y:5, Z:6},
{X:7, Y:8, Z:9},
];
var result = myObject.map(e => ({Y: e.Y}));
console.log(result);

Even more so if you add in some destructuring as Jared did. :-)

answered Dec 20, 2017 at 13:38

T.J. Crowder

1.1m201 gold badges2k silver badges2k bronze badges

Comments

Ferenc Kamras · Accepted Answer · 2017-12-20 13:39:15Z

1

You can achieve this with the map function

var myObject = [ 
  {X:1, Y:2, Z:3},
  {X:4, Y:5, Z:6},
  {X:7, Y:8, Z:9},
];

var test = myObject.map(row => { 
  return {
      Y: row.Y 
  };
});

console.log(test);

answered Dec 20, 2017 at 13:39

Ferenc Kamras

1841 silver badge6 bronze badges

Comments

Denis · Accepted Answer · 2017-12-20 13:40:14Z

1

I didn't quite understand the desired output notation put you can use a map anyways:

myObject.map(element => element.Y) // Output [2, 5, 8]
myObject.map(element => ({Y: element.Y})) // Output [{Y: 2}, {Y: 5}, {Y: 8}]

answered Dec 20, 2017 at 13:40

Denis

2,1681 gold badge14 silver badges15 bronze badges

Comments

Logar · Accepted Answer · 2017-12-20 17:32:10Z

0

Depending on how reusable you want your code to be, I find it fairly elegant to add some currying :

const arr = [
    {X:1, Y:2, Z:3},
    {X:4, Y:5, Z:6},
    {X:7, Y:8, Z:9},
];

const get = prop => o => ({[prop]: o[prop]});
const extract = arr => prop => arr.map(get(prop));

const result = extract(arr)('Y');
console.log(result);

answered Dec 20, 2017 at 17:32

Logar

1,2489 silver badges19 bronze badges

Collectives™ on Stack Overflow

elegant code to extract a subset array from an object array?

5 Answers 5

8 Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

8 Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related