creating arrays of objects in javascript

Question

I'm learning javascript coming from a .NET background. I have a question about how to deal with arrays of objects, creating and manipulating doesn't seem as easy/obvious as .NET.

Often in .NET code I use structs (c#) or structures (VB.NET) for managing simple value constructs, for example (in VB.NET):

    Public Structure WidgetsStruc
        Public Name As String 
        Public LocX As Integer
        Public LocY As Integer
    End Structure
    Private myWidgets As New WidgetsStruc
    myWidgets.LocX = 35
    myWidgets.LocY = 312
    myWidgets.Name = "compass"
    Messagebox(myWidgets.Name)              ' shows 'compass'
    ...

in javascript from the research I have done there isn't anything quite equivalent, although you can use an object and 'push' it onto an array like the below which works:

    var widget = new Object();
    var widgetTemplates = new Array();
    widgetTemplates.push(widget);
    widgetTemplates[0].name = "compass";
    widgetTemplates[0].LocX = 35;
    widgetTemplates[0].LocY = 312;
    alert(widgetTemplates[0].name);          // also shows 'compass'          

Maybe I'm not used to working in a more loosely typed language but the JavaScript above doesn't seem optimal (eg. having to 'push' an object without a declared structure into the array and initializing the variables afterwards, plus 'pop' and 'slice' for removing).

Have I got this right? Is there a better or easier way of declaring & using arrays of objects? I also looked into JSON but not exactly sure how to use that for manipulating user defined objects in an array.

As a JavaScript n00b - thanks for any guidance!

Answer 1

You can use object and array literal notation:

var widgetTemplats = [
    {
        name: 'compass',
        LocX: 35,
        LocY: 312
    },
    {
        name: 'another',
        LocX: 52,
        LocY: 32
    }
]

For simple things like this, the lack of enforced structure is fairly normal. If you do want more enforced structure, or to attach behaviours to your objects, you should look in to classes in JavaScript:

var Widget = function(name, x, y) {
    this.name = name;
    this.LocX = x;
    this.LocY = y;
};

var widgets = [
    new Widget('compass', 35, 312),
    new Widget('another', 52, 32)
];