Getting the values for a specific key from all objects in an array

Question

I'm running an express.js app that has a few apis feeding data to dropdown boxes. The data returned is in the form:

  [
    {
        key: 'blah',
        value: 'Blah Blah'
    },
    {
        key: 'foo',
        value: 'Foos'
    },
    {
        key: 'bar',
        value: 'Bars'
    },
    {
        key: 'baz',
        value: 'Bazingo'
    }
];

where key is my option key and value is the display text. The structure of this array is fixed and I know for a fact that I'll always have key and value as the fields in each object in the array.

When I try to validate the form submitted (additional server side validation), I'd like to cross-reference the value provided for a field against all the values for "key" in the array (blah, foo, bar, baz). Given that this is going to be a frequently used route, I'd like to avoid iterating over the array to find the permitted values, every single time. Is there a simpler way to do this? In other words, I know I can use:

 permittedValues = [];
 for (i = 0; i < array.length; i++){
    permittedValues[i] = array[i]["key"];
 }

but I'd like to avoid this for loop, if possible.

P.S: This seems to be a fundamental question and the answers I found online didn't exactly answer my question. So, apologies if this has already been asked and answered.

Answer 1

You could map:

permittedValues = array.map(function(value) {
  return value.key;
});

In ES6/ES2015 it's even prettier with arrow functions:

permittedValues = array.map(value => value.key);

It might be prettier, but it's probably not faster than a for() loop.

Answer 2

Using lodash,

Since lodash 4.x the _.pluck function has been removed in support to map function.

so you can achieve the desired task by:

import _ from 'lodash'
_.map(items, 'key');

Ref: What happened to Lodash _.pluck?

Answer 3

Pure Javascript ES6

array.map(value => value.key);

Underscore/Lodash

_.map(value,'key')

Answer 4

If you are using ES6 javascript version you can do something like the one below:

const arrayData = [
    {
        key: 'blah',
        value: 'Blah Blah'
    },
    {
        key: 'foo',
        value: 'Foos'
    },
    {
        key: 'bar',
        value: 'Bars'
    },
    {
        key: 'baz',
        value: 'Bazingo'
    }
];
const foodBar = arrayData.find(item => item.key === "baz");
const resultValue = foodBar['value']; // here the extracted value is by key

Answer 5

In the current versions of Javascript you need a loop do to it.

However you can use a module like npm `lodash' to make it look simpler

var _ = require('lodash')
var permittedValues = _.pluck(array, 'key')

link to pluck documentation

Answer 6

You could extract the values via map, and form them into a regex to match values against.

Example: http://repl.it/X0V

var items=
[
    {
        key: 'blah',
        value: 'Blah Blah'
    },
    {
        key: 'foo',
        value: 'Foos'
    },
    {
        key: 'bar',
        value: 'Bars'
    },
    {
        key: 'baz',
        value: 'Bazingo'
    }
];

var toReg = items.map(function(obj){
    return obj.key; 
}).join('|');
var regex = new RegExp('^('+ toReg +')$');

//To test the regex
var itemsToTest = ['blah', 'Pies', 'foo', 'Bazingo'];
itemsToTest.forEach(function(key){
   if(regex.test(key)){
       console.log(key);
   }
});

Answer 7

Try this..

const myArray = [
    {
        key: 'blah',
        value: 'Blah Blah'
    },
    {
        key: 'foo',
        value: 'Foos'
    },
    {
        key: 'bar',
        value: 'Bars'
    },
    {
        key: 'baz',
        value: 'Bazingo'
    }
];
const resObject = myArray.find(item => item.key === "foo");
// Here you can access object which you want
console.log(resObject);

Also you can refer this answer..

Find object by id in an array of JavaScript objects