How to set/edit variables in Object.keys

Question

I'm trying to use use Object.keys in a map function but i'm getting keys based on map value variable but it's giving me error my data object as you can see i'm trying to get the keys of Display and coin value from map variable and the coin value is in the array at the end but it's giving me error in short i'm want to get the keys of every object in display child object and display child key will be from my coin name array so i don't have to hardcode it

 {this.props.crypto_head_coins.map(coin => {
 return (
      <div key={coin} className="crypto_head">
        <span>{coin} </span>
         {console.log(Object.keys(this.props.crypto_head_data.DISPLAY.coin))}
        <p>{this.props.crypto_head_data.DISPLAY.BTC.USD.PRICE}</p>
      </div>
   );
  })}

if i want BTC object keys i don't have to hard code Object.keys(this.props.crypto_head_data.DISPLAY.BTC) and so on i'm mapping from my coin name array and getting coin name i'm setting to my Object.keys(this.props.crypto_head_data.DISPLAY.coin) like this but it's giving me error — dis fat bidge, Oct 18 '19 at 17:19
if i do Object.keys(this.props.crypto_head_data.DISPLAY) then it will work the problem is in coin — dis fat bidge, Oct 18 '19 at 17:21
Welcome to StackOverflow! Could you please edit your post to include some example data (e.g. `this.props.crypto_head_coins`) and an example of what it should output? It is currently a little bit hard to interpret what exactly is the desired behavior, what happens instead, and what the error is. — cbr, Oct 18 '19 at 17:22
i have added the image of my data object you can check it. basically i'm mapping through this.props.crypto_head_coins which is in the end in my data image and i'm getting the keys based on the map value (e.g. BTC,ETH) then the coin should be BTC THEN ETH and so on Object.keys(this.props.crypto_head_data.DISPLAY.coin) but it's giving me error of this Cannot convert undefined or null to object — dis fat bidge, Oct 18 '19 at 17:28
Ah. If `coin` is just a string like "BTC", "ETH", ..., and `DISPLAY` is an object where the key is one of those strings, you can just access it directly without Object.keys: `this.props.crypto_head_data.DISPLAY[coin]` — cbr, Oct 18 '19 at 17:29
Take a look at this question: [*JavaScript property access: dot notation vs. brackets?*](https://stackoverflow.com/q/4968406/996081) — cbr, Oct 18 '19 at 17:34
Possible duplicate of [JavaScript property access: dot notation vs. brackets?](https://stackoverflow.com/questions/4968406/javascript-property-access-dot-notation-vs-brackets) — Emile Bergeron, Oct 18 '19 at 20:21

score 0 · Accepted Answer · answered Oct 18 '19 at 17:33

This does not work, because DISPLAY is expected to have a literal key called "coin".

Object.keys(this.props.crypto_head_data.DISPLAY.coin);

This will work, because you are referencing the variable coin as a possible key in DISPLAY.

Object.keys(this.props.crypto_head_data.DISPLAY[coin]);

{
  this.props.crypto_head_coins.map(coin => {
    return (
      <div key={coin} className="crypto_head">
        <span>{coin}</span>
        {console.log(Object.keys(this.props.crypto_head_data.DISPLAY[coin])}
        <p>{this.props.crypto_head_data.DISPLAY.BTC.USD.PRICE}</p>
      </div>
    );
  });
}

How to set/edit variables in Object.keys

1 Answers1