Mapping through array of objects and access their property dynamically (with a variable)

Question

I have an array with different objects inside. I want to write a function pluck which takes the array & a property and return an array of all the values of that property in the different objects.

I have tried this:

var paints = [
    {color: 'red'},
    {color: 'yellow'},
    {color: 'blue'},
];

function pluck(arr, property) {
    return arr.map(function(obj, property) {
        return obj[property];
    });

}
console.log(pluck(paints, 'color'));

This does not work.

If I change the function like so:

function pluck(arr) {
    return arr.map(function(obj) {
        return obj['color'];
    });

...it works, but it is obviously hard-coded now. However, I would like to call the function and specify which property I want to have returned in an array.

Possible duplicate of [From an array of objects, extract value of a property as array](http://stackoverflow.com/q/19590865/218196) — Felix Kling, May 17 '17 at 15:31

score 1 · Accepted Answer · answered May 17 '17 at 15:30

So very close.

function pluck(arr, property) {
    return arr.map(function(obj) {
        return obj[property];
    });
}

You didnt need the property argument in the inner function, and by having it you redefined the one you're passing in to be something else.

var paints = [
    {color: 'red'},
    {color: 'yellow'},
    {color: 'blue'},
];

function pluck(arr, property) {
    return arr.map(function(obj) {
        return obj[property];
    });

}
console.log(pluck(paints, 'color'));

The concept is called [`[Variable] Shadowing`](https://en.wikipedia.org/wiki/Variable_shadowing) — mhodges, May 17 '17 at 15:32

Mapping through array of objects and access their property dynamically (with a variable)

1 Answers1