22

I am having an array that consists the objects with a key, value how can we iterate each object for caste and id.

[
    Object {
        caste = "Banda",
        id = 4
    },
    Object {
        caste = "Bestha", 
        id = 6
    }
]
2
  • iterate over the array of objects? iterate over object fields? both? Apr 26, 2013 at 10:40
  • iterate over array of objects ..
    – sasi
    Apr 26, 2013 at 10:41

9 Answers 9

40

Using jQuery.each():

var array = [
   {caste: "Banda", id: 4},
   {caste: "Bestha", id: 6}
];
    
$.each(array, function( key, value ) {
  console.log('caste: ' + value.caste + ' | id: ' +value.id);
}

);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

4
  • How? I didn't understand what you meant.
    – RRikesh
    Apr 26, 2013 at 11:00
  • for the first iteration it gives me banda and 4 for the second iteration it again gives banda and 4 ,bestha and 6 like that..
    – sasi
    Apr 26, 2013 at 11:02
  • 2
    As TheBronx said see his answer, its just an array. Since that solution uses native Javascript, it might be a better design if you don't want do use jQuery in your project. Apr 27, 2013 at 4:30
  • 2
    The question was tagged with jquery, I though OP wanted a jQuery answer. Or course vanilla JS is faster.
    – RRikesh
    Apr 27, 2013 at 10:48
15

Example code:

var list = [
    { caste:"Banda",id:4},
    { caste:"Bestha",id:6},
];
    
for (var i=0; i<list.length; i++) {
    console.log(list[i].caste);
}

It's just an array, so, iterate over it as always.

10

In plain JavaScript you can do this:

var array = [{caste: "Banda", id: 4}, {caste: "Bestha", id:6}];

array.forEach(function(element, index) {
    console.log(element.id+" "+element.caste);
});

The callback function is called with a third parameter, the array being traversed. For learn more!

So, you don't need to load jQuery library.

Greetings.

4
var array = [{caste: "Banda", id: 4}, {caste: "Bestha", id:6}];
var length = array.length;
for (var i = 0; i < length; i++) {
   var obj = array[i];
   var id = obj.id;
   var caste = obj.caste;
}
4

Arrow functions are modern these days

Using jquery $.each with arrow function

 var array = [
    {caste: "Banda", id: 4},
    {caste: "Bestha", id: 6}
 ];

 $.each(array, ( key, value ) => {
     console.log('caste: ' + value.caste + ' | id: ' +value.id);
 });

Using forEach with arrow function

  array.forEach((item, index) => {
      console.log('caste: ' + item.caste + ' | id: ' +item.id);
  });

Using map with arrow function. Here map returns a new array

  array.map((item, index) => {
      console.log('caste: ' + item.caste + ' | id: ' +item.id);
  });
0
2

The forEach loop accepts an iterator function and, optionally, a value to use as "this" when calling that iterator function.

 var donuts = [
    { type: "Jelly", cost: 1.22 },
    { type: "Chocolate", cost: 2.45 },
    { type: "Cider", cost: 1.59 },
    { type: "Boston Cream", cost: 5.99 }
];

donuts.forEach(function(theDonut, index) {
    console.log(theDonut.type + " donuts cost $"+ theDonut.cost+ " each");
});

Subsequently it can also be broken down to this

var donuts = [
  { type: "Jelly", cost: 1.22 },
  { type: "Chocolate", cost: 2.45 },
  { type: "Cider", cost: 1.59 },
  { type: "Boston Cream", cost: 5.99 }
];


function ShowResults(donuts) {  
    console.log(donuts.type + " donuts cost $"+ donuts.cost+ " each");  
}

donuts.forEach(ShowResults);
1

you can use jquery to iterate through all the objects jQuery wants you to fill a callback function, which jquery will call back. The first input parameter will be given the key and the second input parameter the value:

$.each(dataList, function(index, object) {
   $.each(object,function(attribute, value){
      alert(attribute+': '+value);
   });
});

documentation: http://api.jquery.com/jQuery.each/

1
  • 1
    The fourth line should be });
    – Seralto
    Jan 12, 2017 at 20:13
0

Use jQuery.each:

$.each([your array of objects], function(index, value) {
  // Do what you need, for example...
  alert(index + ': ' + value);
});
0

To iterate over an array filled with stuff in jQuery use $.each, to iterate over an Object for its properties use for..in

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.