Object entry


Navigating and managing data structures is a very important skill for every level of engineer, which needs to be possessed and improved.Over the years, the JavaScript language has continued to provide more ways to manage data structures, from Object.keys to Object.values and many more.One of my favorites is Object.entries, An API that provides keys and values ​​through an array of arrays. Let’s take a look!

Consider the following objects:

const obj = {
    name: "David",
    color: "green",
    balance: 100
}

Traditionally, we would pass a for Loop, and then use array syntax to get the value:

const obj = {
    name: "David",
    color: "green",
    balance: 100
}

for (const key in obj) {
    const value = obj[key];
}

We do have Object.keys() with Object.values() Now get each one, but neither method provides a relationship with the parent key or value.I really like to use Object.entries Maintain this relationship and get keys and values:

Object.entries({
    name: "David",
    color: "green",
    balance: 100
}).forEach(([key, value]) => console.log(key, value))

/*
name David
color green
balance 100
*/

Object.entries This is a very useful method when you need keys and values.Throw away those old ones for Syntax and usage of loops and similar arrays Object.entries Like a professional!

  • 7 basic JavaScript functions

    I remember in the early days of JavaScript, you need a simple function to handle almost everything, because browser vendors implement different functions, not just edge functions, basic functions, such as addEventListener with attachEvent. Times have changed, but every developer should still have some features…

  • Welcome to my new office

    My first professional web development was in a small printing factory, where I sat in a small cubicle without windows all day. Before I was able to find a remote job to work from home, I was tortured in the environment for nearly five years. first of all…

  • Use JavaScript and CSS animation to detect DOM node insertion
  • 9 incredible CodePen demos

    CodePen is a treasure trove of incredible demos that leverage the power of the client language. The client is always limited by the content that the browser provides us, but the creativity and ingenuity of the developers always break the boundaries of what we think the front-end can do. Thanks CSS…


Leave a Reply

Your email address will not be published. Required fields are marked *