Looping data in javascript is one of the most crucial task, if we are making any web application there is most chance that we are looping some data to UI, Array and object are two main data structure in javascript in that almost all time we look to do a looping through array or object of array

looping data to some html and css is one of basic level of task at least a beginner should know, in looping data the most common problem we face is , how to write code in such a way it take less number of lines and more reliable in logic after loop

If we have to loop single data then without thinking we can go for Array, but if we would have to loop through two piece of data inter link to each other in such a manner that one is static and another is dynamic or say static then first thing comes in our mind is object since object contains key value pair so in that perspective if we could iterate both key and value in loop then that will solve our problem

So there are some ways to iterate through object key value pair

By using for .. in loop

const obj = {
    "key1": "value1",
    "key2": "value2",
    "key3": "value3"
}

for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
        console. log(key +" -> "+ obj[key]);
    }
}

We use the for-in loop as shown. However, we need to use hasOwnProperty() method so that the key we get would be an actual property of an object, and doesn't from the prototype

ES6 way — By using Object.entries

const obj = {
    "key1": "value1",
    "key2": "value2",
    "key3": "value3"
}

for (let [key, value] of Object.entries(obj)) {
    console. log(`${key} -> ${value}`);
}

By using Object.keys

const obj = {
    "key1": "value1",
    "key2": "value2",
    "key3": "value3"
}

Object.keys(obj).forEach((res) => {
    console. log(res +" -> "+ obj[res]);
})

Conclusion

There are lot more ways to iterate key value pair in loop, above are most common ways javascript developers use in day to day code, being a developer we need to know at-least basics of data structure for handling data with the help of code.