Iterating over dictionary- JavaScript

Question

I have here a script were i fetch info from an api.

fetch(url,opts)
.then((response) => {
  return response.json();
})
.then((data) => {
  const newdata = data;
  const balances = newdata['data']['ethereum']['address'][0];
  
  const symbol = balances['balances'][0]['currency'];
  const value = balances['balances'][0]['value'];
  const bal = balances;
  console.log(symbol, value);
  //document.getElementById("tokenBalance").innerHTML = symbol.symbol + "," + symbol.address + "," + value;

  console.log(bal);
});

console.log(bal) gives this output https://ibb.co/DRS5vNv

How can i access from balances(bal): currency {symbol & address} and {value}? and than print it all in a table format like this: TokenName, Tokenaddress, balance?

Because the size of the array can change, in my case it has 34 elements but it can have 5 10 or 100

{balances: Array(34)}
balances: Array(34)
0:
currency: {symbol: "TOAD", address: "0x463e737d8f740395abf44f7aac2d9531d8d539e9"}
value: 0.00084138
__proto__: Object
1: {currency: {…}, value: 0.9}
2: {currency: {…}, value: 0}
3: {currency: {…}, value: 0}
4: {currency: {…}, value: 1395658765.4499083}
5: {currency: {…}, value: 0}
6: {currency: {…}, value: 0.06632153}
7: {currency: {…}, value: 0}
8: {currency: {…}, value: 0}
9: {currency: {…}, value: 0}
10: {currency: {…}, value: 391.66319725}
11: {currency: {…}, value: 22989070.87819258}
12: {currency: {…}, value: 207933.87278968}
13: {currency: {…}, value: 1}
14: {currency: {…}, value: 0}
15: {currency: {…}, value: 0}
16: {currency: {…}, value: 19304224871.809647}
17: {currency: {…}, value: 1360077933.9251838}
18: {currency: {…}, value: 100}
19: {currency: {…}, value: 1.1219391}
20: {currency: {…}, value: 3e-8}
21: {currency: {…}, value: 0}
22: {currency: {…}, value: 2461419000}
23: {currency: {…}, value: 0}
24: {currency: {…}, value: 529155969901.41156}
25: {currency: {…}, value: 0.10935729}
26: {currency: {…}, value: 4285038710.5060315}
27: {currency: {…}, value: 0}
28: {currency: {…}, value: 0}
29: {currency: {…}, value: 10}
30: {currency: {…}, value: 205.5986161}
31: {currency: {…}, value: 10}
32: {currency: {…}, value: 0.1637196}
33: {currency: {…}, value: 13367128.75739117}
length: 34

Answer 1

You're getting back a JavaScript Array . Iterate it using forEach or a simple for for loop .

In your case, something like:

bal.forEach(function(item, index, array) {
  console.log(item.currency, item.value);
});

should do the trick.

Answer 2

The simplest solution is to use a for loop

for (let i=0; i<data.length; i++) {
    console.info(
        data[i].currency.symbol, 
        data[i].currency.address, 
        data[i].value
    );
}