assigning array strings to a variable

Question

assigning array strings to a variable

Assembling a collection of element IDs like this:

var menus = $(".menu").map(function(){
            return this.id;
        });

The result might look something like this:

["lunch", "appetizers", "soup", "salads", "seafood", "noodles", "stir_fry", "curry", "kids", "steak", "dessert", "sides"]

My goal is to retrieve JSON data for each item in the array.

        $.each(menus,function(i) {
            var list = menus[i],
            meal = data.menu.list,
            items = '<li><h3>' + meal.name + '</h3><p>' + meal.desc + '</p></li>';

            $('#'+list+".menu").append(items);
        });

In this scenario, data.menu.list represents data.menu.lunch, data.menu.appetizers, and so forth.

The JSON structure is as follows:

{
    "menu": {
        "lunch": [{
            "name": "Kao PAdd",
            "desc": "Fried rice with onions, green onions, snow peas, and egg / Chicken, vegetarian / Shrimp or tofu (Add $1)"
        }

Any ideas on how to proceed without resorting to eval()?

EDIT: When I execute this code:

$.each(data.menu,function(i) {
    console.log(data.menu[i].key);
});

I receive the following output in the console:

Object {lunch: Array(14), appetizer: Array(11)}

All I want to do is access those arrays.

console.log(data.menu[i].name)

This returns a pair of undefined values.

javascript arrays json

Answer 1

Answer №1

Wow, what an excellent query, my good Sir!

Regardless of how you fetch your menus, the function strToVar() is up to the challenge.
This snippet of code transforms strings from an array into variable names:

Solution:
    var strToVar = (str,val) => this[str] = val;

Example:
    var menus = ["lunch", "appetizers", "soup", "salads", "seafood", "noodles", 
        "stir_fry", "curry", "kids", "steak", "dessert", "sides"];
    menus.forEach(strToVar);
    prompt("[lunch, appetizers, soup, salads, seafood, noodles, " +
        "stir_fry, curry, kids, steak, dessert, sides]", 
        [lunch, appetizers, soup, salads, seafood, noodles, 
        stir_fry, curry, kids, steak, dessert, sides]);

All your points belong to me.

Answer 2

Wow, what an excellent query, my good Sir!

Regardless of how you fetch your menus, the function strToVar() is up to the challenge.
This snippet of code transforms strings from an array into variable names:

Solution:
    var strToVar = (str,val) => this[str] = val;

Example:
    var menus = ["lunch", "appetizers", "soup", "salads", "seafood", "noodles", 
        "stir_fry", "curry", "kids", "steak", "dessert", "sides"];
    menus.forEach(strToVar);
    prompt("[lunch, appetizers, soup, salads, seafood, noodles, " +
        "stir_fry, curry, kids, steak, dessert, sides]", 
        [lunch, appetizers, soup, salads, seafood, noodles, 
        stir_fry, curry, kids, steak, dessert, sides]);

All your points belong to me.

Answer 3

Answer №2

For those interested in converting a JSON string into an object, check out this code snippet:

var jsonStr = '{"data":{"item":{"id":1,"value":"bar"}}}';
var jsonObject = JSON.parse(jsonStr);
console.log(jsonObject.data.item.value);

Answer 4

For those interested in converting a JSON string into an object, check out this code snippet:

var jsonStr = '{"data":{"item":{"id":1,"value":"bar"}}}';
var jsonObject = JSON.parse(jsonStr);
console.log(jsonObject.data.item.value);

Answer 5

Answer №3

The challenge lay in my lack of clarity regarding my true objectives. I found myself posing the wrong question (albeit an intriguing one, so I will preserve it for now).

Initially, I mistakenly believed that I needed to derive my variable list based on HTML IDs. However, I eventually realized that a simple additional for loop (or jQuery each()) was all that was required:

    $.each(data.menu, function(i) {
        var list = data.menu[i],
            menus = [];
        $.each(list, function(x) {
            var items = '<li><h3>' + list[x].name + '</h3><p>' + list[x].desc + '</p></li>';

            menus.push(items)
        });
        $('#' + i).append(menus);
    });

Answer 6

The challenge lay in my lack of clarity regarding my true objectives. I found myself posing the wrong question (albeit an intriguing one, so I will preserve it for now).

Initially, I mistakenly believed that I needed to derive my variable list based on HTML IDs. However, I eventually realized that a simple additional for loop (or jQuery each()) was all that was required:

    $.each(data.menu, function(i) {
        var list = data.menu[i],
            menus = [];
        $.each(list, function(x) {
            var items = '<li><h3>' + list[x].name + '</h3><p>' + list[x].desc + '</p></li>';

            menus.push(items)
        });
        $('#' + i).append(menus);
    });

Answer 7

Answer №4

Here is your updated $.each function:

$.each(menus, function(i, list) {
    var meal = data.menu[list],
        items = '<li><h3>' + meal.name + '</h3><p>' + meal.desc + '</p></li>';

    $('#' + list).append(items);
});

If you need more information on bracket notation, check out the MDN documentation here.

Answer 8

Here is your updated $.each function:

$.each(menus, function(i, list) {
    var meal = data.menu[list],
        items = '<li><h3>' + meal.name + '</h3><p>' + meal.desc + '</p></li>';

    $('#' + list).append(items);
});

If you need more information on bracket notation, check out the MDN documentation here.

Answer 9

Answer №5

Based on my comprehension, it seems you are aiming to achieve a functionality similar to the following :

var meals = ["breakfast", "brunch", "lunch", "dinner"];
var mealList = [
                 {
                   "name":"breakfast",
                   "description":"morning delights"
                 },
                 {
                   "name":"brunch",
                   "description":"late morning feast"                 
                 },
                 {
                   "name":"lunch",
                   "description":"afternoon nourishment"                 
                 },
                 {
                   "name":"dinner",
                   "description":"evening satisfaction"                 
                 }
               ]
var meal = {};

for(var i in meals) {
  meal[meals[i]] = [{
      "label": mealList[i].name,
      "info": mealList[i].description
  }];
}

console.log(meal);

Answer 10

Based on my comprehension, it seems you are aiming to achieve a functionality similar to the following :

var meals = ["breakfast", "brunch", "lunch", "dinner"];
var mealList = [
                 {
                   "name":"breakfast",
                   "description":"morning delights"
                 },
                 {
                   "name":"brunch",
                   "description":"late morning feast"                 
                 },
                 {
                   "name":"lunch",
                   "description":"afternoon nourishment"                 
                 },
                 {
                   "name":"dinner",
                   "description":"evening satisfaction"                 
                 }
               ]
var meal = {};

for(var i in meals) {
  meal[meals[i]] = [{
      "label": mealList[i].name,
      "info": mealList[i].description
  }];
}

console.log(meal);

assigning array strings to a variable

Answer №1

Wow, what an excellent query, my good Sir!

Answer №2

Answer №3

Answer №4

Answer №5

Similar questions

Methods for reducing arrays in JavaScript

When the same component is conditionally rendered, it does not activate the mounted() hook

Identifying memory leaks in Javascript

Accessing JavaScript results in PHP

Unusual octal phenomenon

Make sure to validate onsubmit and submit the form using ajax - it's crucial

Activate CSS3 Transform using a JavaScript button click

Managing null values in a map using Jackson

Maintaining the generic types in mapped types in TypeScript

Utilize morris.js within an AngularJS directive to handle undefined data

Having trouble accessing a two-dimensional array using pointers

How to toggle the visibility of an element in an array using AngularJS and JavaScript

Troubleshooting Bootstrap 4's Multiple Sort Functionality in Tables

How to extract user data from a JWT token using Node.js?

Discovering the reverse order of an array in C++

JSON is functioning properly, however, I am encountering difficulties trying to make JSONP work

Creating a multidimensional JSON array using PHP

Error encountered while trying to connect to WebSocket: InvalidStateError

How many elements are in the string[] array?

Excel - Fetch data from an array