Accessing JavaScript objects with string key within an array

Question

I have the following data structure:

var settings = {
    notifications: [
        {
            'logout' : {
                icon: 'fa fa-sign-out',
                text: [
                    {heading: 'Logout'},
                    {body: 'You have unsaved data. Are you sure you want to log out?'},
                ]
            }
        },
        {
            'delete' : {
                icon: 'fa fa-times',
                text: [
                    {heading: 'Delete'},
                    {body: 'This operation can not be undone. Are you sure you want to delete?'},
                ]
            }
        },
    ],
};

How do I retrieve the value of logout.icon, when I don't know the logout object's position in the notification array?

Solutions for plain nested objects listed here give me undefined.

--- SOLUTION

Based on Yassine Moustarham's answer here is my reusable function:

function getProp(arr,key,prop)
{
    for(var i=0;i<arr.length;i++)
    {
        if(arr[i][key])
        {
            return arr[i][key][prop];
        }
    }
    return false;
};

var icon = getProp(settings.notifications, 'logout', 'icon');

Thanks to Felix Kling for the simplification suggestion.

Wouldn't it be more logical to call your key something which can be applied to all objects? `notifications: [ { type: 'logout', icon: ..., text: ... }, { type: 'delete', ... } ]`. That way you only need to loop through the `type` properties contained within each of your `nootifications`' objects. — James Donnelly, Sep 11 '14 at 15:09
Thanks for the suggestion and the link, it's not the same case, but very useful nonetheless. — orszaczky, Sep 11 '14 at 15:35

Yassine Moustarham · Accepted Answer · 2014-09-11T16:03:59.040

3

here you go : if you are sure that they will definitly be a member of one of the notifications array elements called logout then this function will return his icon member

function getIcon()
{
    for(i=0;i<settings.notifications.length;i++)
    {
        if(typeof(settings.notifications[i].logout)!=='undefined')
        {
            return settings.notifications[i].logout.icon;
        }
    }
    return false;
}

undefined was writting wrong ! and thinks to Felix Kling you need to add typeof befor comparing with 'undefined'.

edited Sep 11 '14 at 16:03

answered Sep 11 '14 at 15:22

Yassine Moustarham

56
4

This is simple and does exactly what I need. Thanks! – orszaczky Sep 11 '14 at 15:31
I wonder why this was accepted. `settings.notifications[i].logout!=='undifined'` is very wrong. It should either be `... !== undefined` or `typeof ... !== 'undefined'`. And it could be simplified to just `if (...)` – Felix Kling Sep 11 '14 at 15:47
1

you're right my bad ;) @FelixKling i will update the answer – Yassine Moustarham Sep 11 '14 at 15:53
@Felix I updated my question with my solution based on this answer, I chose it because I found it very simple and did exactly what I needed. Apart from the typo is there any reason against this answer (or for the Calvin's one)? – orszaczky Sep 11 '14 at 16:06
1

@TheRebel: Nope, but you could have pointed out the mistake ;) It just seems odd to have incorrect code in an accepted answer, even if it is a tiny mistake. – Felix Kling Sep 11 '14 at 16:14
@Felix, you are right, actually I also overlooked the typo, thank you for spotting it, and also thanks for the simplification suggestion! ;) – orszaczky Sep 11 '14 at 16:26

Calvin Froedge · Answer 2 · 2014-09-11T15:16:21.577

2

You'll need to iterate over the object's properties recursively until you find the key you're looking for:

function findKey(object, key){
  if (object.hasOwnProperty(key)) {
    // do stuff
    console.log('found');
    return true;
  }
  for (var property in object) {
    if (typeof object[property]=='object') {
      return findKey(object[property], key);
    } 
  }
}

findKey({'bop':{'foo':'bar'}}, 'foo');

edited Sep 11 '14 at 15:16

answered Sep 11 '14 at 15:10

Calvin Froedge

16,135
16
55
61

won't this only return the value of 'foo' within the 'bop' object if there is such a key? what if there are multiple bop objects in the array? – orszaczky Sep 11 '14 at 15:24
@TheRebel It's recursive. It calls itself and would return on the first time the key is found. – Calvin Froedge Sep 11 '14 at 15:26
@TheRebel If you want it to handle multiple 'bop' objects, take out the return statements and it will iterate until it has looked at every object / key. – Calvin Froedge Sep 11 '14 at 15:27

Accessing JavaScript objects with string key within an array

2 Answers2