Question 217948 in Javascript Question posted in
A very good W3school tutorial can be found here.

How can I loop through arrays inside and object in JavaScript es6?

How can I loop through arrays inside an object in JavaScript es6? I tried the following code

for(let x of Object.keys(headings?.value)){
              console.log(x);
            }

data i wants to loop through

"value":{
        "h3":[
           "Best selling products",
           "Best Corporate Laptops",
           "BEST PRICED LAPTOPS",
           "Shop By Brands"
        ],
        "h4":[
           "Lenovo Thinkpad Touchscreen Yoga X380/i5/8th gen/13.3" screen",
           "Lenovo thinkpad T440S/core i7/4th gen/14"screen"
        ],
        "h5":[
           "View All",
           
        ]
     }
Tags:

3

Answers


  1. 0

    This code will print the keys (h3, h4, h5) along with their corresponding items in the console. If data is a JSON string, you need to parse it into an object using JSON.parse() before using the code below.

    const data = {
      "value": {
        "h3": [
          "Best selling products",
          "Best Corporate Laptops",
          "BEST PRICED LAPTOPS",
          "Shop By Brands"
        ],
        "h4": [
          "Lenovo Thinkpad Touchscreen Yoga X380/i5/8th gen/13.3" screen",
          "Lenovo thinkpad T440S/core i7/4th gen/14"screen"
        ],
        "h5": [
          "View All",
        ]
      }
    };

// Loop through the keys (h3, h4, h5..)
for (const key in data?.value) {
  // Loop through the array of each key
  for (const item of data?.value[key]) {
    console.log(key, item);
  }
}
    Login or Signup to reply.
  2. 0

    Now that you know each key, you just need to access the values of the object.

    Alternatively, you can use Object.values() if you don’t care about the keys

    const headings = {
  "value":{
      "h3":[
         "Best selling products",
         "Best Corporate Laptops",
         "BEST PRICED LAPTOPS",
         "Shop By Brands"
      ],
      "h4":[
         "Lenovo Thinkpad Touchscreen Yoga X380/i5/8th gen/13.3" screen",
         "Lenovo thinkpad T440S/core i7/4th gen/14"screen"
      ],
      "h5":[
         "View All",

      ]
   }
 };

console.log("KEY/VALUE PAIRS");
for(let key of Object.keys(headings.value)){
  const val = headings.value[key];
  console.log(key, val);
}

console.log("VALUES ONLY");
for(let val of Object.values(headings.value)){
  console.log(val);
}
    Login or Signup to reply.
  3. 0

    In JavaScript ES6, you can use the Object.entries() method to get both the keys and values of the object. Then, you can iterate through each array using a nested loop. Here’s how you can do it:

    const headings = {
  "value": {
    "h3": [
      "Best selling products",
      "Best Corporate Laptops",
      "BEST PRICED LAPTOPS",
      "Shop By Brands"
    ],
    "h4": [
      "Lenovo Thinkpad Touchscreen Yoga X380/i5/8th gen/13.3" screen",
      "Lenovo thinkpad T440S/core i7/4th gen/14"screen"
    ],
    "h5": [
      "View All",
    ]
  }
};

for (const [key, value] of Object.entries(headings?.value)) {
  console.log(`Heading level: ${key}`);
  for (const item of value) {
    console.log(item);
  }
}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search