How can I get a specific value from an object?

Question

I am creating an object and want to output the value of id:

   var result = {};
  $.each($('.color input').serializeArray(), function() {
      result[this.name] = this.value;
  });  
  
  console.log(result[id]);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
<input type="hidden" name="name" value="fred">
<input type="hidden" name="id" value="23">
</div>

The result I expect is 23

Possible duplicate of [Dynamically access object property using variable](https://stackoverflow.com/questions/4244896/dynamically-access-object-property-using-variable) — msanford, Dec 14 '17 at 14:09

score 2 · Answer 1 · answered Dec 14 '17 at 14:04

You must call result['id']or result.id since idis not declared as a variable

   var result = {};
  $.each($('.color input').serializeArray(), function() {
      result[this.name] = this.value;
  });  
  
  console.log(result.id);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
<input type="hidden" name="name" value="fred">
<input type="hidden" name="id" value="23">
</div>

Pranav C Balan · Answer 2 · 2017-12-14T14:11:22.917

First of all, you need to get the name and value property from the object which can get as the second argument. And get the property using ['id'] or .id syntax.

var result = {};
$.each($('.color input').serializeArray(), function(i, v) {
  result[v.name] = v.value;
});

console.log(result.id);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
  <input type="hidden" name="name" value="fred">
  <input type="hidden" name="id" value="23">
</div>

Or generate the object as follows by iterating simply using each() method on the jQuery input element collection.

var result = {};
$('.color input').each(function() {
  result[this.name] = this.value;
});

console.log(result.id);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
  <input type="hidden" name="name" value="fred">
  <input type="hidden" name="id" value="23">
</div>

War10ck · Accepted Answer · 2017-12-14T14:07:37.367

The error you're receiving is because the browser believes that id is a variable. You need to access it via either result['id'] or result.id to get the property's value from the object:

Example 1: Access property value using bracket notation

   var result = {};
  $.each($('.color input').serializeArray(), function() {
      result[this.name] = this.value;
  });  
  
  console.log(result['id']);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
<input type="hidden" name="name" value="fred">
<input type="hidden" name="id" value="23">
</div>

Example 2: Access property value using object notation

   var result = {};
  $.each($('.color input').serializeArray(), function() {
      result[this.name] = this.value;
  });  
  
  console.log(result.id);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
<input type="hidden" name="name" value="fred">
<input type="hidden" name="id" value="23">
</div>

How can I get a specific value from an object?

3 Answers3