Trying to get an object value in from a key in Javascript

Question

I'm trying to get a country label (name) from a value (country code) in an object.

In Vue.js I'm trying to build a computed property to return the name of the country based on the country code from an API request.

In the template:

countryLabel () {
    var countries = require('../../plugins/countries')
    var countryCode = this.content.country
    function getLabelByValue(countries, countryCode) {
        return Object.keys(countries).find(label => countries[value] === countryCode)
    }
}

From a list of countries:

module.exports = [
    { value: 'AF', label: 'Afghanistan' },
    { value: 'AX', label: 'Aland Islands' },
    { value: 'AL', label: 'Albania' },
    { value: 'DZ', label: 'Algeria' },
    { value: 'AS', label: 'American Samoa' },
    { value: 'AD', label: 'Andorra' },
    { value: 'AO', label: 'Angola' },
    { value: 'AI', label: 'Anguilla' },
    { value: 'AQ', label: 'Antarctica' },
    { value: 'AG', label: 'Antigua and Barbuda' },
    ...
]

Well, Object.keys on an array will return you 0->n. I think what you want is simply countries.find(country => country.value === countryCode) — mhodges
– mhodges, Commented Jun 7, 2017 at 19:55

rossipedia · Accepted Answer · 2017-06-07 19:55:47Z

3

You probably don't want to be calling Object.keys on an array.

Something like this is probably more what you want:

function getLabelByValue(countries, countryCode) {
    const entry = countries.find(item => item.value === countryCode);
    return entry ? entry.label : null;
}

The problem is that calling Object.keys on an array will return an array of numbers that have been converted to strings:

> console.log(Object.keys(['this', 'is', 'an', 'array']));
['0', '1', '2', '3']

Since your exports is already an array, you can call find() on it directly.

answered Jun 7, 2017 at 19:55

rossipedia

59.8k10 gold badges95 silver badges94 bronze badges

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

1 Comment

Jack Barham Over a year ago

I had to remove the function wrapped around it, but it's worked. Thanks.

frodo2975 · Accepted Answer · 2017-06-07 20:02:28Z

2

A better way to do this would be to use an object, which is always the fastest way to lookup anything in javascript because objects are dictionaries. So if you changed your export to look like: { AF: 'Afghanistan', AX: 'Aland Islands', etc... } then you'd be able to do instant lookups by doing countries[countryCode].

answered Jun 7, 2017 at 20:02

frodo2975

12k5 gold badges39 silver badges51 bronze badges

3 Comments

Jack Barham Over a year ago

Thanks. Out of curiosity, how would you do the look up?

frodo2975 Over a year ago

See the last part of my post. It's just a regular object, so you'd do something like `countries['AF'], and you'd get the value of that key.

Jack Barham Over a year ago

I see what you mean. Thanks

Jack Barham · Accepted Answer · 2017-06-07 20:11:35Z

0

Based on rossipedia's answer this is working for me:

countryLabel () {
    const countries = require('../../plugins/countries')
    return countries.find(item => item.value === this.content.country).label
}

answered Jun 7, 2017 at 20:11

Jack Barham

3,21912 gold badges45 silver badges64 bronze badges

1 Comment

mhodges Over a year ago

Just be careful about the this context. If you decide to change your arrow function into a standard function, this code will break.

Collectives™ on Stack Overflow

Trying to get an object value in from a key in Javascript

3 Answers 3

1 Comment

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related