Retrieve object with a key in javascript

Question

I have following object, and if I want to retrieve only soccer, then I put soccer as follows, sports['soccer'] does not bring it.

I wonder what I am missing here?

sports = [] ; 

sports = [{
    "soccer": {
        "type": "foot",
        "player": 11
    },
    "basketball": {
        "type": "hand",
        "player": 5
    }
}]

Is there a reason that you have an array with a single object? Will the array have multiple objects in your actual code? — Code-Apprentice, Oct 12 '18 at 23:02
without hardcoded, is there a way to iterate through and find the object with the given key which is soccer in my case. — casillas, Oct 12 '18 at 23:07
Possible duplicate of [Access / process (nested) objects, arrays or JSON](https://stackoverflow.com/questions/11922383/access-process-nested-objects-arrays-or-json) — JJJ, Oct 16 '18 at 17:29

score 3 · Answer 1 · answered Oct 12 '18 at 23:04

3

Your current code creates an array with a single object. One solution is to just create an object instead:

sports = {
    "soccer": {
        "type": "foot",
        "player": 11
    },
    "basketball": {
        "type": "hand",
        "player": 5
    }
}

Now you can use sports.soccer or sports['soccer'] to access the soccer data.

If you really want an array of objects, you first need to subscript the array to get the first object:

sports[0].soccer

or

sports[0]['soccer']

answered Oct 12 '18 at 23:04

Code-Apprentice

81,660
23
145
268

Is there a way to keep as an array then find the corresponding object with a given key which is soccer. – casillas Oct 12 '18 at 23:05
@hotspring If you want to get the object by a key as a variable, you can do `sports[0][key]`. – Code-Apprentice Oct 12 '18 at 23:19

score 0 · Answer 2 · answered Oct 12 '18 at 23:14

var sports is an array with objects inside.

If you set it up like this:

sports = [] ; 

sports = {
   "soccer": {
       "type": "foot",
       "player": 11
   },
   "basketball": {
      "type": "hand",
      "player": 5
   }
}

then you will be able to call sports['soccer'] or even sports.soccer.

Alternately, if you need it to remain an array, then you'll need to do more work. Something like this should do the trick.

for(i=0; i < sports.length; i++) {
  if("soccer" in sports[i]){
    console.log(sports[i].soccer.type);
    console.log(sports[i].soccer.player);
  }
}

The console.logs represent whatever you want to do with the values

score 0 · Answer 3 · answered Oct 12 '18 at 23:30

I think you really need to reiterate the basics of javascript a bit.

In JS we can create data structures on the fly with literal syntax. For example:

let normalArr = new Array();
let literalArr = [];

let normalObj = new Object();
let literalObj = {};

When you create arrays and objects with literal syntax you can initialize arrays with elements and object with properties on the fly. This is what exactly happened in your example:

sports = [{
    "soccer": {
        "type": "foot",
        "player": 11
    },
    "basketball": {
        "type": "hand",
        "player": 5
    }
}];

The code can be broken down in the following way:

You created an array which was stored in the sports variable using the array literal syntax (created an array on the fly).
You created 1 element of the array with the object literal syntax (creating an object on the fly)
This object (located inside the array) has 2 properties, soccer and basketball which are also object created with object literal syntax.

To access one of there objects you need to do the following:

const sports = [{
    "soccer": {
        "type": "foot",
        "player": 11
    },
    "basketball": {
        "type": "hand",
        "player": 5
    }
}];

// accessing the first element of the sports array
console.log(sports[0].soccer);
console.log(sports[0].basketball);

score 0 · Answer 4 · answered Oct 12 '18 at 23:40

0

As others have pointed out, you have an array of objects, not a single object. You can use the find() method to find the element that has the soccer property, and then access that property.

var soccer = sports.find(s => 'soccer' in s)['soccer'];

answered Oct 12 '18 at 23:40

Barmar

741,623
53
500
612

Retrieve object with a key in javascript

4 Answers4