使用JavaScript访问变量对象的属性

Question

I have a js object that looks like this:

 var object = {
      "divisions": {
          "ocd-division/country:us": {
              "name": "United States",
          }
      }
    };

I want to access the property listed under the nested object "ocd-division/country:us" (aka "name"), but the problem I'm having is that "ocd-division/country" is a variable object. Like it might be ":can" for Canada or something.

My question is, can I still access the name property under that object even though it's variable? I wrote the code I came up with below, but it calls the object literally, so it can't account for a change in the object's name.

    var country = document.getElementById("p");
    p.innerHTML = object.divisions["ocd-division/country:us"].name;

I'm new to JavaScript so I'm sorry if this is a dumb question.

Answer 1

When you don't know the properties of an object, you can use

• for...in loop

  It iterates enumerable own and enumerable inherited properties.

• Object.keys

  It returns an array which contains enumerable own properties.

• Object.getOwnPropertyNames

  It returns an array which contains own properties.

 // Adding properties: "ownEnumerable", "ownNonEnumerable", // "inheritedEnumerable" and "inheritedNonEnumerable" var obj = Object.defineProperties({}, { ownEnumerable: {enumerable: true}, ownNonEnumerable: {}, }); Object.defineProperties(Object.prototype, { inheritedEnumerable: {enumerable: true}, inheritedNonEnumerable: {}, }); // Display results function log(id, arr) { document.getElementById(id).textContent = '[' + arr.join(', ') + ']'; } log('forin', function(forInProps){ for (var prop in obj) forInProps.push(prop); return forInProps; }([])); log('keys', Object.keys(obj)); log('names', Object.getOwnPropertyNames(obj)); 

 <dl> <dt><code>for...in</code></dt><dd id="forin"></dd> <dt><code>Object.keys</code></dt><dd id="keys"></dd> <dt><code>Object.getOwnPropertyNames</code></dt><dd id="names"></dd> </dl> 

Answer 2

object.divisions[Object.keys(object.divisions)[0]].name

Answer 3

Sure...

for (var division in object.divisions) {
    var name = object.divisions[division].name;
    // Do what you want with name here
}

If the object has prototype methods you will want to use Object.prototype.hasOwnProperty() to ensure they don't get iterated like so:

for (var division in object.divisions) {
    if (!object.divisions.hasOwnProperty(division)) continue;
    var name = object.divisions[division].name;
    // Do what you want with name here
}

Or use Object.keys() if you don't care about IE8 support and iterate over those.

Object.keys(object.divisions).forEach(function(division) {
    var name = object.divisions[division].name;
    // Do what you want with name here
});

EDIT: Upon re-reading your question it occurs to me that you may already know the key name but want to access the object with a variable key name, which is also absolutely fine:

var division = 'ocd-division/country:us';
object.divisions[division].name;

When using [] bracket notation to access an object you can insert any code that evaluates to a string, you could even call a function in there that returns a string.

See: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors

Answer 4

You can iterate through object using for loop.

var obj = {
    "divisions":{
      "ocd-division/country:us":{
         "name" : "United States"
      }
    }
}

Here is the for loop

for(var a in obj){ //loop first the object
  for(var b in obj[a]){ // then second object (divisions)
    for(var c in obj[a][b]){ //then third object (ocd-division/country:us)
      if(c == 'name'){ //c is the key of the object which is name
        console.log(obj[a][b][c]); //print in console the value of name which is United States.
        obj[a][b][c] = "Canada"; //replace the value of name.
        var objName = obj[a][b][c]; //or pass it on variable. 
      }
    }
  }
}

console.log(obj); //name: Canada
console.log(objName); //name: United States

You can also use this reference:
https://developer.mozilla.org/enUS/docs/Web/JavaScript/Reference/Statements/for
http://stackoverflow.com/questions/8312459/iterate-through-object-properties