JavaScript Objects

Posted on Thursday, 6th June 2013 by admin
An object is a package or collection of data. This data may be simple, such as strings and numbers, or it may be more complex. In particular, the object can also contain other objects.

JavaScript is very much committed to objects. Everything important in JavaScript is defined in or as an object. Arrays are objects. Functions are objects. Even if you have data which is not in an object it is. The default object is the Global object, which in web browsers is identified with the window object.

Primitive Data

The only things in JavaScript which are not objects are the so-called primitive types, like numbers and strings, and this is for technical and performance reasons. However, the minute you try to do anything tricky with one (such as change the case of a string), it is implicitly wrapped in an object.

The most obvious characteristic of a primitive type is that it is limited to a single value.

Creating an Object

If you have had some experience with JavaScript objects, bear with us as we start from firs principals. If you have used another language, such as Java, you’re in for some culture shock.

You can create an object using the following:

var thing = new Object();

but that would be a waste of time. JavaScript supports the following notation which use an Object Literal:

var thing = {};

Not only is it less typing and slightly clearer, it also allows you to populate it with data:

var thing = {
    apple: 1,
    banana: 'two',
    'something else': infinity,
}

This is know an Object Literal.

This is Not Java

In case you need to be reminded, JavaScript is no more a type of Java than is a Caterpillar a type of Cat. We need not Catalogue all of the differences, but ignoring them will be Catastrophic.

In Java, as in most Object-Oriented languages, you create an Object by first creating a Class. A Class acts as a template for multiple copies or instances. A class which is designed to be used in its original form without (necessarily) creating copies is called a Static Class.

In JavaScript the word class is a reserved word, but it is not used as such. In JavaScript discussions, the word class is often used to describe objects which have a common ancestry, but this is more informal.

The point to remember is this:

JavaScript Objects are not based on a Class.

Object Data

Objects may contain one or more variables. In the context of the object, these variables are referred to as properties. A property is just a variable inside an object.

You can add, change, or even delete an object property after the object has been created:

thing.cherry = 3;   //  thing.cherry is created or changed;

As seen in the previous example, properties can also be created and assigned when you create the object using the Literal notation. Note, however, the following points when using the literal notation:

• properties and values are assigned by a colon; that is, you do not use an equals
• property/value assignments are separated by commas, not semicolons; you may include a trailing comma if you like

In any case, property names are subject to the same naming rules as ordinary variables, and can’t be reserved words or include spaces.

In Literal notation, that may create some problems for some names, so JavaScript allows you to enclose awkward property names in quotes. You can also include harmless names in quotes, if you think that it makes it more readable.

Accessing Object Properties

There are 1½ ways to refer to an object property:

• All properties can be accessed using this notation: object[‘property’]
• Most properties can be accessed using this notation: object.property

The second notation is simpler, but cannot be used for awkward property names. The first notation is more flexible, and has the added benefit of allowing you to access a property defined at runtime:

property = 'something';
alert(object[property]);

Later, we will see that JavaScript has a number of specialised objects including Arrays and Functions. We will also have a look at some of the built-in objects provide by JavaScript.