Question

2

Get key and value of object in JavaScript?

rated 0 times [ 4] [ 2] / answers: 1 / hits: 155721 / 12 Years ago, wed, may 23, 2012, 12:00:00

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?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

byrondonavanc

Add To Favorites

Follow

Total Points: 675

Total Questions: 107

Total Answers: 105

Location: Peru

Member since Fri, Oct 14, 2022

2 Years ago

byrondonavanc questions

1 Mongoose, getting TypeError: Cannot read properties of undefined (reading 'find')

Tue, Dec 28, 21, 00:00, 2 Years ago

1 Properly handle multiple files input with Formik and React

Tue, Apr 6, 21, 00:00, 3 Years ago

1 Puppeteer pdf page break bug

Thu, Mar 25, 21, 00:00, 3 Years ago

1 React useEffect() : Most efficient way to compare if two arrays of objects are equal

Fri, Dec 4, 20, 00:00, 4 Years ago

1 How to close dropdown on outside click NEXT.JS

Sat, Jul 25, 20, 00:00, 4 Years ago

View All

answered 12 Years ago noe · Accepted 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 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.

There are no semantics in {Nike: 50}. What's Nike? What's 50?

{key: 'Nike', value: 50} is a little better, since now you can iterate an array of these objects and values are at predictable places. This makes it easy to write code that handles them.

Better still would be {vendor: 'Nike', itemsSold: 50}, because now values are not only at predictable places, they also have meaningful names. Technically that's the same thing as above, but now a person would also understand what the values are supposed to mean.