iterating nested js objects

Question

i've had trouble accessing this Object :

{
  "BTC": {
    "price": 13322.848306438736,
    "percent_change_24h": 2.00659441,
    "market_cap": 246870460628.15366,
    "volume_24h": 33956399259.1725,
    "circulating_supply": 18529856,
    "total_supply": 18529856,
    "max_supply": 21000000
  },
  "ETH": {
    "price": 380.8150073343507,
    "percent_change_24h": -0.67132589,
    "market_cap": 43115533610.355606,
    "volume_24h": 15706287212.275429,
    "circulating_supply": 113219103.1865,
    "total_supply": 113219103.1865,
    "max_supply": null
  }
}

and so far i've tried Object.key() , map(), making it an array, algorithmic methods and so on. i could get the list of outer objects by :

Object.keys(this.state.dataApi).map((value,key)=>(
                   value
                  ))

i could get what's inside "BTC" for example as an object by :

this.state.dataApi.BTC

but i wasn't able to get its inner elements one by one. this is the expected output example

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

these are my output successful tries

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

Note: this also tried changing type from the state [] , {} , "" , only "" got me a bit somewhere as it leaves the object in its original type.

Victor · Accepted Answer · 2020-11-02 04:42:54Z

2

let obj= {
  "BTC": {
    "price": 13322.848306438736,
    "percent_change_24h": 2.00659441,
    "market_cap": 246870460628.15366,
    "volume_24h": 33956399259.1725,
    "circulating_supply": 18529856,
    "total_supply": 18529856,
    "max_supply": 21000000
  },
  "ETH": {
    "price": 380.8150073343507,
    "percent_change_24h": -0.67132589,
    "market_cap": 43115533610.355606,
    "volume_24h": 15706287212.275429,
    "circulating_supply": 113219103.1865,
    "total_supply": 113219103.1865,
    "max_supply": null
  }
};

console.log(obj["BTC"]);
console.log(obj["ETH"].price);

Object.keys(obj).map((value,key)=>{
   console.log(obj[value]);
   console.log(obj[value].price);
}
                  )

You were right. But you need access object using['value']

edited Nov 2, 2020 at 4:42

answered Oct 31, 2020 at 10:22

Victor

4,2091 gold badge32 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

EagleMind Over a year ago

that was the most logical path indeed, thank you it worked!

xy2_ · Accepted Answer · 2020-10-31 10:13:28Z

0

You were on the right track with Object.keys. There's another method called Object.values that gives you the values for each key of the object.

If our object is data, then Object.keys(data) will give us a two-value array/. Afterwards, we could, for example iterate with map() to get all prices:

Object.values(o).map(d => d.price)

let o = {
  "BTC": {
    "price": 13322.848306438736,
    "percent_change_24h": 2.00659441,
    "market_cap": 246870460628.15366,
    "volume_24h": 33956399259.1725,
    "circulating_supply": 18529856,
    "total_supply": 18529856,
    "max_supply": 21000000
  },
  "ETH": {
    "price": 380.8150073343507,
    "percent_change_24h": -0.67132589,
    "market_cap": 43115533610.355606,
    "volume_24h": 15706287212.275429,
    "circulating_supply": 113219103.1865,
    "total_supply": 113219103.1865,
    "max_supply": null
  }
}
console.log(Object.values(o))

answered Oct 31, 2020 at 10:13

xy2_

7,3123 gold badges20 silver badges34 bronze badges

2 Comments

EagleMind Over a year ago

yes that works too but for only for mapping not to select one element, for exemple only the "BTC" and then access its details : Object.values(this.state.dataApi).map(d => console.log(d.btc.price))

xy2_ Over a year ago

In that case, use Object.values() on the selected element: Object.values(this.state.dataApi.BTC), giving you an array with each property of the BTC.

Naren · Accepted Answer · 2020-10-31 11:39:01Z

0

Have you tried for..in loop?, you can loop object with for...in. You can read here

const parent = {
  "BTC": {
    "price": 13322.848306438736,
    "percent_change_24h": 2.00659441,
    "market_cap": 246870460628.15366,
    "volume_24h": 33956399259.1725,
    "circulating_supply": 18529856,
    "total_supply": 18529856,
    "max_supply": 21000000
  },
  "ETH": {
    "price": 380.8150073343507,
    "percent_change_24h": -0.67132589,
    "market_cap": 43115533610.355606,
    "volume_24h": 15706287212.275429,
    "circulating_supply": 113219103.1865,
    "total_supply": 113219103.1865,
    "max_supply": null
  }
}

for (const key in parent) { // This is just O(n)
  // key - BTC,ETH
  console.log(parent[key].price)
  console.log(parent[key].percent_change_24h)
}

edited Oct 31, 2020 at 11:39

answered Oct 31, 2020 at 10:12

Naren

4,5293 gold badges20 silver badges32 bronze badges

2 Comments

EagleMind Over a year ago

Yes that works for mapping all of them but you cannot access them one by one like this : getBTC= () =>{ for (const key in this.state.dataApi.BTC) { console.log("bitcoin",this.state.dataApi[key]["price"],this.state.dataApi[key]["percent_change_24h"],this.state.dataApi[key]["market_cap"]) } } and i use for loop i get an empty answer!

Naren Over a year ago

Above solution iterates one by one only, you just need to replace parent with this.state.dataApi. And time complexity is O(n)

Collectives™ on Stack Overflow

iterating nested js objects

3 Answers 3

1 Comment

2 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related