flossfan flossfan - 1 month ago 8
Javascript Question

Get key and value of object in JavaScript?

Given a JavaScript array of objects, how can I get the key and value of each object?

The code below shows what I'd like to do, but obviously doesn't work:

var top_brands = [ { 'Adidas' : 100 }, { 'Nike' : 50 }];
var brand_options = $("#top-brands");
$.each(top_brands, function() {
brand_options.append($("<option />").val(this.key).text(this.key + " " + this.value));
});


So, how can I get
this.key
and
this.value
for each entry in the array?

Answer

Change your object.

var top_brands = [ 
  { key: 'Adidas', value: 100 }, 
  { key: 'Nike', value: 50 }
];

var $brand_options = $("#top-brands");

$.each(top_brands, function(brand) {
  $brand_options.append(
    $("<option />").val(brand.key).text(brand.key + " " + brand.value)
  );
});

As a rule of thumb:

  • An object (a data structure) has data and structure.
  • 'Adidas', 'Nike', 100 and 50 are data.
  • Object keys are structure. Using data as the object key is semantically wrong. Avoid it.