Underscore – _.pluck

On June 25, 2012, in JavaScript, by Jim Cowart

Continuing what I hope to be an occasional series on underscore.js, I wanted to cover the “pluck” method in this post.

From underscore’s documentation, pluck has the following signature:
_.pluck(list, propertyName)

You can pass an array or an object to the first argument of _.pluck – if you pass an object, it iterates over the members of the object.

There’s really not much of a mystery as to what this function does. It’s pretty much a “_.map” shortcut – given a list of objects, you want to extract the values of a specific property on those objects into a new array. For example:

var addresses = [
    { city: "Nashville", state: "TN", zip: "37212" },
    { city: "Chattanooga", state: "TN", zip: "37406" },
    { city: "Signal Mountain", state: "TN", zip: "37377" },
    { city: "Snellville", state: "GA", zip: "30078" },
    { city: "Evergreen", state: "CO", zip: "80437" }
];
// get an array of the zip codes
var zips = _.pluck( addresses, "zip" );
// zips = [ "37212", "37406", "37377", "30078", "80437" ]

Simple, eh? I’ve been surprised to see many using this function only when they’re extracting primitives into an array, but using _.map to extract members that are objects (without any other modification as part of the extraction). If all you need to do is extract the object members as they are, pluck works just fine for that, too – and it saves a decent chuck of precious keystrokes:

var developers = [
    { name: "Jim Cowart", location: { city: "Signal Mountain", state: "TN" } },
    { name: "Elijah Manor", location: { city: "Nashville", state: "TN" } },
    { name: "John Papa", location: { city: "Orlando", state: "FL" } },
    { name: "Nicholas Cloud", location: { city: "St. Louis", state: "MO" } },
    { name: "Josh Bush", location: { city: "Nashville", state: "TN" } }
];
// the long way about it using _.map
var locations = _.map( developers, function( developer ) {
    return developer.location;
});

// the shorter way using _.pluck
locations = _.pluck( developers, "location" );

Anytime you can use ‘pluck’ in place of ‘map’, it might increase your code’s readability – especially if you’re using it conjunction with other operations. Consider this:

// getting an intersect of cities from two lists of locations, using map
var cities = _.intersection(
    _.map( locationsA, function( location ) {
        return location.city;
    }),
    _.map( locationsB, function( location ) {
        return location.city;
    }),
);

// getting an intersect of cities from two lists of locations, using pluck
cities = _.intersection( _.pluck( locationsA, "city" ), _.pluck( locationsB, "city" ) );
Tagged with:  
  • http://twitter.com/keithnorm Keith Norman

    Cool, thanks for the post! I often forget about pluck.

    Just wanted to point out that underscore supports an OO style that I think reads more clearly for most cases:

    _([{foo: 'bar'}, {foo: 'baz'}]).pluck(‘foo’) // ['bar', 'baz']

    • http://ifandelse.com Jim Cowart

      Thanks Keith. That’s a good reminder. I personally find the functional style more readable (which is why I imagine Jeremy included both approaches – accessibility from both paradigms).