Check if click linked in array has a submenu key value. IF true run some code ELSE run other code

I have an object, linkItems that contains an array. I am not sure how to check the link that is clicked if it has a submenu then run some code such as don't close the menu else run close the menu?

                            <ul class="main-nav" onclick="{!c.onClick}">
                                <aura:iteration items="{!v.linkItems}" var="item" indexVar="i">
                                        <aura:if isTrue="{!item.subMenu}">
                                            <li>
                                                <a data-menu-item-id="{!item.id}" href="JavaScript:Void(0);">{!item.label}</a>
                                            <ul>
                                                <aura:iteration items="{!item.subMenu}" var="subItem" indexVar="id">
                                                    <li><a data-menu-item-id="{!subItem.id}" href="#">{!subItem.label}</a></li>
                                                </aura:iteration>
                                            </ul>
                                            </li>
                                        <aura:set attribute="else">
                                                <li><a data-menu-item-id="{!item.id}" href="">{!item.label}</a></li>
                                        </aura:set>
                                        </aura:if>
                                    </aura:iteration>
                            </ul>

When I console.log the var linkItems this is what is returned:

> Proxy {0: {…}, 1: {…}, 2: {…}, 3: {…}, 4: {…}, 5: {…}, 6: {…}, 7: {…}, 8: {…}}
    > [[Handler]]: Object

        [[Target]]: Array(9)
        > 0: {id: 0, label: "Home", active: false}

        1: {id: 1, label: “About”, active: false}

        2: {id: 2, label: “Page3”, active: false}
        
3: {id: 3, label: “Page4”, active: false}

        4: {id: 4, label: “Page5”, active: false}

        5: {id: 5, label: “Page6”, active: true}

        6: {id: 6, label: "Page7”, active: false}

        7: {id: 10, label: "Support Pages", subMenu: Array(3), active: false}

        8: {id: 15, label: "More", subMenu: Array(4), active: false}
length: 9
__proto__: Array(0)

    * [[IsRevoked]]: false

Updated code:

    onClick : function(component, event, helper) {
        var linkItems = component.get('v.linkItems'); //array of linkItems
        console.log('linkItems', linkItems);
        var id = event.target.dataset.menuItemId;
        console.log(id, 'id');
        console.log(JSON.stringify(event.target.dataset)); //returns menuItemId
        component.set("v.selected",parseInt(id)); //sets v.selected to selected menu item id
        if (id) {

            // var linkItems = linkItems.reduce(function (acc, it) {
            //     return acc[it.id] = it, acc;
            // }, {});

            linkItems.map(function (item) {
                return item.subMenu && item.subMenu.length ? 'open' : function() {component.getSuper().navigate(id)};
            });

            //console.log(linkItems);

            //component.getSuper().navigate(id);

            // console.log('idArray', JSON.stringify(linkItems));
            // console.log(linkItems[id].id);
            // console.log('label', linkItems[id].label);
            // console.log(linkItems[id].subMenu);
            // console.log('linkItems.id', linkItems.id);
        }
    }, 

This is still not working. On click, I need to check the id of the link that was clicked then check if it has a submenu.

TIA.

from Check if click linked in array has a submenu key value. IF true run some code ELSE run other code