YanPro
YanPro

Reputation: 25

How to modify properties in array

I'm trying to modify a property in an array and add new elements under it.

The array was taken from - https://jsonplaceholder.typicode.com/users

My code just added a new properties instead of modifying them

I tried the following code (by using axios)

const axios = require('axios');

const getData = async() => {
    let {data: myData} = await axios.get('https://jsonplaceholder.typicode.com/users')

    myData.forEach((e) => {
        myData.push({
            phone: {
                "phoneNumber": e.phone,
                "phoneType": ''
            }
        })
    })
    console.log(myData)
}

I want to get -

{
    "id": 1,
    "name": "Leanne Graham",
    "username": "Bret",
    "email": "[email protected]",
    "address": {
      "street": "Kulas Light",
      "suite": "Apt. 556",
      "city": "Gwenborough",
      "zipcode": "92998-3874",
      "geo": {
        "lat": "-37.3159",
        "lng": "81.1496"
      }
    },
    "phone":{
     "phoneNumber": "1-770-736-8031 x56442",
      "phoneType": ''
},
    "website": "hildegard.org",
    "company": {
      "name": "Romaguera-Crona",
      "catchPhrase": "Multi-layered client-server neural-net",
      "bs": "harness real-time e-markets"
    }
  },

But I'm getting

[ { id: 1,
    name: 'Leanne Graham',
    username: 'Bret',
    email: '[email protected]',
    address:
     { street: 'Kulas Light',
       suite: 'Apt. 556',
       city: 'Gwenborough',
       zipcode: '92998-3874',
       geo: [Object] },
    phone: '1-770-736-8031 x56442',
    website: 'hildegard.org',
    company:
     { name: 'Romaguera-Crona',
       catchPhrase: 'Multi-layered client-server neural-net',
       bs: 'harness real-time e-markets' } },

  { phoneNumber: '1-770-736-8031 x56442', phoneType: '' },
]

Upvotes: 1

Views: 133

Answers (4)

Jason Davin
Jason Davin

Reputation: 1

Use map array function

const data = myData.map(user => ({ ...user, phone: {
    phoneNumber: user.phone,
    phoneType: ''
}}));

Upvotes: 0

libik
libik

Reputation: 23029

myData is an array, so by calling myData.push you are adding one more object to an array.

Using forEach will give you each object in an array in variable e so you need to use the e.

As you want to update object inside array, then you probably want this:

const getData = async() => {
    let {data: myData} = await axios.get('https://jsonplaceholder.typicode.com/users')

    myData.forEach((e) => {
        e.phone = {
                "phoneNumber": e.phone,
                "phoneType": ''
            }
    })
    console.log(myData)
}

Upvotes: 0

charlietfl
charlietfl

Reputation: 171679

You want to transform the existing phone property not push a new object to the array

myData.forEach((e) => {
    e.phone = {
            "phoneNumber": e.phone,
            "phoneType": ''
        };       
});

Upvotes: 0

Kinjal
Kinjal

Reputation: 680

You can try this:

myData.forEach((e, index) => {
        myData[index].phone =  {
                "phoneNumber": e.phone,
                "phoneType": ''
            }
    })

OR

myData.forEach((e, index) => {
        e.phone =  {
                "phoneNumber": e.phone,
                "phoneType": ''
            }
    })

Upvotes: 1

Related Questions