JSFiddle - React, Tailwind, and code Playground

by batcave

JavaScript

const formats = {
  "thumbnail": {
    "name": "thumbnail_1685914.jpg",
    "hash": "thumbnail_1685914_8fac17c75f",
    "ext": ".jpg",
    "mime": "image/jpeg",
    "width": 245,
    "height": 153,
    "size": 7.32,
    "path": null,
    "url": "/uploads/thumbnail_1685914_8fac17c75f.jpg"
  },
  "large": {
    "name": "large_1685914.jpg",
    "hash": "large_1685914_8fac17c75f",
    "ext": ".jpg",
    "mime": "image/jpeg",
    "width": 1000,
    "height": 625,
    "size": 81.91,
    "path": null,
    "url": "/uploads/large_1685914_8fac17c75f.jpg"
  },
  "medium": {
    "name": "medium_1685914.jpg",
    "hash": "medium_1685914_8fac17c75f",
    "ext": ".jpg",
    "mime": "image/jpeg",
    "width": 750,
    "height": 469,
    "size": 49.68,
    "path": null,
    "url": "/uploads/medium_1685914_8fac17c75f.jpg"
  },
  "small": {
    "name": "small_1685914.jpg",
    "hash": "small_1685914_8fac17c75f",
    "ext": ".jpg",
    "mime": "image/jpeg",
    "width": 500,
    "height": 313,
    "size": 24.49,
    "path": null,
    "url": "/uploads/small_1685914_8fac17c75f.jpg"
  }
}

const images = formats.reduce(function(list, item) {
	const image = {
  	name: item.name,
    width: item.width,
    url: item.url
  }
  
  list.push(image)
  
  return list
}, [])

console.log(images)