Get the variable name in javascript

Question

I have an object called main and its one of the item, data: , points to an array defined as submenuitem. When user clicks on something, the UI gets updated with array items in submenuitems. It also updates the topbar to display the title of current menu which is basically the variable name SUBMENUITEMS.

Can anyone tell how can I get the submenu item variable name data: "--->this<--" as String?

let submenuItems = ["subMenu 1","subMenu 2","subMenu 3","subMenu 4","subMenu 5","subMenu 6"];

let main = {
    title:'main menu', 
    menuLogo:'img/logo1.png',
    data:submenuItems
}

Edit:

I see a lot of confusion. Actually this a part of my code which is written using Vuejs -

<div v-for="(item,index) in dataArray" v-on:click="subMenu(item)" v-bind:id="'tile_'+index" class="card">
                <div><img v-bind:src=item.menuLogo onerror="this.src='img/default.svg'" /></div>
                <div>{{item.title}}</div> 
                <div>{{index+1}}</div>
            </div>



let subhome = [ 
{"title":"sub_card_title","sub_cardimage":"sub_item1.png",data:[]},
{"title":"sub_card_title","sub_cardimage":"sub_item1.png",data:[]},    {"title":"sub_card_title","sub_cardimage":"sub_item1.png",data:[]},`
{"title":"sub_card_title","sub_cardimage":"sub_item1.png",data:[]}
] 

let home = [ 
{"title":"card_title","cardimage":"item1.png",data:[]},
{"title":"card_title","cardimage":"item1.png",data:subhome},    {"title":"card_title","cardimage":"item1.png",data:[]},`
{"title":"card_title","cardimage":"item1.png",data:[]}
] 



 let menu = new Vue({
        el: '#menu',
        data: {
            dataArray: home
        },
        methods: {
            subMenu: function(item) {
                if (item.data.length > 0) {
                    this.dataArray = item.data;
                    console.log('sub menu array -->', this.dataArray);
                    $('#menu-title').text(eval(item));
                }
            },setTitle: function(val) {
                 let title = eval(val); // <---- how to vaiable name of data array
                 $('#spancontainer').text(title)
            }  
        } 
    });

wouldn't you need to pass it as an object - something like `data: { 'submenuItems': submenuItems }` — Pete, Jun 14 '18 at 15:20
Possible duplicate of [How to convert variable name to string in JavaScript?](https://stackoverflow.com/questions/417645/how-to-convert-variable-name-to-string-in-javascript) — melpomene, Jun 14 '18 at 15:23
@NikhilAggarwal No, I don't want values. I want the "subemnuitems" as string. — Greyfrog, Jun 14 '18 at 15:39
@JonasW.yes, I want that as string. Thank you, only you understood my question. — Greyfrog, Jun 14 '18 at 15:39
@melpomene No, I know that already and it doesn't solve my problem.Please see my edit. — Greyfrog, Jun 14 '18 at 15:40
I don't understand your new code (or what it has to do with the question), but I'm pretty sure using `eval()` is wrong there. — melpomene, Jun 14 '18 at 15:59

Joseph Webber · Answer 1 · 2018-06-14T16:19:27.883

0

When you do

let submenuItems = ["subMenu 1","subMenu 2","subMenu 3","subMenu 4","subMenu 5","subMenu 6"];

let main = {
    title:'main menu', 
    menuLogo:'img/logo1.png',
    data:submenuItems
}

it is equating to

let main = {
    title:'main menu', 
    menuLogo:'img/logo1.png',
    data:["subMenu 1","subMenu 2","subMenu 3","subMenu 4","subMenu 5","subMenu 6"]
}

In order to get "submenuItems", you'd need to pass it as an object and get its key like this

let main = {
    title:'main menu', 
    menuLogo:'img/logo1.png',
    data:{
        submenuItems: submenuItems
    }
}
console.log(Object.keys(main.data)[0]);

or simply create a new property and set it to "submenuItems" like this

let main = {
    title:'main menu', 
    menuLogo:'img/logo1.png',
    data:{
        name: 'submenuItems',
        submenuItems: submenuItems
    }
}
console.log(main.data.name);

edited Jun 14 '18 at 16:19

answered Jun 14 '18 at 15:56

Joseph Webber

2,010
1
19
38

"*If you were to update `submenuItems`, `main.data` would not reflect the changes.*" This is only true for assignments to the `submenuItems` variable itself, as in `submenuItems = ...`. Any update of the array would be reflected. – melpomene Jun 14 '18 at 15:58
Your "proof" shows an assignment to `submenuItems`, which is what I said is the only kind of update that would not be reflected. Try `submenuItems[0] = "hi"` or `submenuItems.splice(1, 2)` instead. – melpomene Jun 14 '18 at 16:13
Sorry, I misunderstood, you're right. I'll edit my answer. – Joseph Webber Jun 14 '18 at 16:16

Get the variable name in javascript

1 Answers1