jQuery / JavaScript object, adding to inside function

Question

I'm struggling with this. I know this is simple when you know how, but I just can't get the hang of it.

I basically want to create an object like this:

data = [{
 a: 1
 b: "test"
 c: 32
}, {
 a: 2
 b: "test2"
 c: 55
}, {
 a: 3
 b: "xyz"
 c: 103
}]

This is just an example of a larger function, so I don't want to do exactly this, but understanding tis will help me do the larger function.

I would've thought the below would work, but it doesn't quite. I'm guessing it just needs a little tweaking:

var data = new Object;
$('.class-name').each(function () {
 var a = $(this).data('a');
 var b = $(this).data('b');
 var c = $(this).data('c');
 data[] = {
 a: a,
 b: b,
 c: c
 }
});

I'm struggling with the adding to object thing and also the fact that I'm declaring the object outside the function.

I've tried data.push but I think I'm getting mixed up with arrays and objects.

Thanks for any help.

• Kyle: You have initialized your data variable as an Object instead of an array. Change data = new Object to data = [] to see if that changes anything. Then continue to use data.push

Answer 1

var data = [];
//since data is an array
//you can use it's native method `push`
//to add an object or primitive to the next/last index
data.push({
 a: 1,
 b: 'test',
 c: 32
});

You can even add multiple objects to the array at once.

data.push({ a: 2 b: "test2" c: 55 }, { a: 3 b: "xyz" c: 103 });

Or you can create the object separately then add it later.

var someObj = {
 a: 123,
 b: 'hello',
 c: 789
};
data.push(someObj);

See related

• user2143356: I've marked this as the answer as it was one of the first and was the one that I followed to get this working. All answers are excellent and Palash Mondal's was probably the most detailed. I can't accept all answers and accepting none isn't helpful, so I've gone with this one. Thanks to everyone.

Answer 2

Use:

data = []
data.push({ a: 1, b: 'test', c: 52 })

Or directly:

data = [{ a: 1, b: 'test', c: 52 }, { a: 2, b: 'test2', c: 53}]

Answer 3

data[] = ...

That's PHP syntax, not JavaScript. You want to use the Array push method instead. Make data an array (not a generic object):

var data = new Array;
// or simpler with an empty array literal:
var data = [];

and then

data.push({
 a: a,
 b: b,
 c: c
});

Answer 4

To keep things simple, do like this:

// Create an empty Array
var data = [];
$('.class-name').each(function () {
 // Get the data attribute values
 var a = $(this).data('a');
 var b = $(this).data('b');
 var c = $(this).data('c');
 // Create an empty Object
 var obj = {};
 // Set the object key-value pairs
 obj['a'] = a;
 obj['b'] = b;
 obj['c'] = c;
 // Push the object to the 'data' array
 data.push(obj);
});
// Check the data array in the console
console.log(data);

FIDDLE DEMO #1

But you can always minimize it like:

// Create an empty Array
var data = [];
$('.class-name').each(function () {
 // Get the data attribute values
 var a = $(this).data('a');
 var b = $(this).data('b');
 var c = $(this).data('c');
 // Push the object to the 'data' array
 data.push({a:a, b:b, c:c});
});
// Check the data array in the console
console.log(data);

FIDDLE DEMO #2

Answer 5

You have to d̶e̶c̶l̶a̶r̶e̶ initialize the data variable as an array and later "push" news object:

var data = [];
$('.class-name').each(function () {
 var a = $(this).data('a');
 var b = $(this).data('b');
 var c = $(this).data('c');
 data.push({
 a: a,
 b: b,
 c: c
 });
});

• Bergi: There are no type declarations in JS. Though you probably mean the right, "declare variable as" sounds wrong.