Developing original data from an array in JavaScript

Question

Developing original data from an array in JavaScript

I am looking to create an API body for use in JavaScript fetch. The array contains around twenty items and I need to iterate through it using a loop.

Here is an example of my array of objects:

[
    {
        name:"x",lname:"y"
    },
    {
        name:"x2",lname:"y2"
    },
]

This is the desired output structure:

{
    "0":{
        "name":"x",
        "lname":"y"
    },
    "1":{
        "name":"x2",
        "lname":"y2"
    },
}

This is how it appears in Postman when sent as the body:

https://i.sstatic.net/k63lI.png

Any suggestions or assistance would be greatly appreciated.

javascript arrays json api postman

Answer 1

Answer №1

To transform an Array into an Object, you can easily achieve this using the Array.reduce method and assigning the index as the key for each property:

const data = [
    {name:"x",lname:"y"},
    {name:"x2",lname:"y2"},
]

console.log( 
  data.reduce((acc, item, i) => ({...acc, [i]:item}) ,{})
)

Alternatively, you can achieve the same result more succinctly, as suggested by @CherryDT (in the comments below), which automatically converts the Array into an Object where keys are derived from the indices of the array items:

const data = [
    {name:"x",lname:"y"},
    {name:"x2",lname:"y2"},
]

console.log({...data})

Pro Tip: If you prefer the keys of the resulting Object to start from 1 instead of 0, you can do this:

console.log({...[,...data]})

Answer 2

To transform an Array into an Object, you can easily achieve this using the Array.reduce method and assigning the index as the key for each property:

const data = [
    {name:"x",lname:"y"},
    {name:"x2",lname:"y2"},
]

console.log( 
  data.reduce((acc, item, i) => ({...acc, [i]:item}) ,{})
)

Alternatively, you can achieve the same result more succinctly, as suggested by @CherryDT (in the comments below), which automatically converts the Array into an Object where keys are derived from the indices of the array items:

const data = [
    {name:"x",lname:"y"},
    {name:"x2",lname:"y2"},
]

console.log({...data})

Pro Tip: If you prefer the keys of the resulting Object to start from 1 instead of 0, you can do this:

console.log({...[,...data]})

Developing original data from an array in JavaScript

Answer №1

Similar questions

What is the best way to eliminate the hash from the URL of a single-route Angular application without the need for ui.router?

How to display a minimalist white dot in three.js

Is there a way to create a customized calendar in Node.js?

Encountering a problem during the conversion of HTML to JSON

Parcel Bundler works perfectly fine on localhost, however, an error is being displayed on the index.html file in the Dist folder

Getting props value in parent component using Vue JS

Locating the elusive sequence number within a document

Obtaining a Slug in the Server-Side Layout of a Next.js Component

AngularJS can retrieve the selected value from a select tag

The index declaration file has not been uploaded to NPM

The syntax for importing JSON in JavaScript ES6 is incredibly straightforward and

Why is JavaScript globally modifying the JSON object?

Creating Scalable Vector Graphics without utilizing identifiers

What is the best way to incorporate a transition effect into a flex item with a specified max-width, where the width adjustments are managed by a child div?

It's impossible to remove a dynamically added class from a button

Testing the update functionality of meta content in the Vue Quasar Meta component using Jest

Explore the associative array within a JSON using jQuery to extract and manipulate the values within the array

Enhancing React Performance: Storing Component Identity in Redux State

Ways to Determine if a User Has Closed the Page

Tips for keeping your button fixed in place