Sometimes, we want to destructure an array of objects with JavaScript.

In this article, we’ll look at how to destructure an array of objects with JavaScript.

How to destructure an array of objects with JavaScript?

To destructure an array of objects with JavaScript, we can use the array destructuring syntax.

For instance, we write:

const someArray = [{
  data: 1
}, {
  data: 2
}, {
  data: 3
}]
const [{
    data: array0
  },
  {
    data: array1
  },
  {
    data: array2
  }
] = someArray

console.log(array0, array1, array2)

to define the someArray array and get the data property values from each object with destructuring.

We assign the data property of the first someArray to array0.

And we assign the data property of the first someArray to array1.

Finally, we assign the data property of the first someArray to array2.

Therefore, console log logs 1 2 3.

Conclusion

To destructure an array of objects with JavaScript, we can use the array destructuring syntax.