Secret Object Truths

Plain variables and primitive types like Number and String are straightforward. Why bother with Objects? The compelling reason is that if you scratch the surface, Objects rule the world. Here's a many-faceted illustration:

var data1 = new Number("5");
var data2 = new String("Anything");
var data3 = data2.substring(1, 4) + data2.charAt(7);   // data3 = nythg (!)

var data4 = new Function("a, b", "return (a<b) ? a : b;");  // return lesser value
data4(3, 5);

var data = new Array(2);
data.0 = "red";            // same as data[0]
data.1 = "blue";            // same as data[1]

var data5 = new Object;
data5["shape"] = "square";      // same as data5.shape
data5["old cost"] = 10.95;      // same as data5.old cost (but that's an error)

var data6 = Math.round(3.45);      // equals 3
var data7 = Date(1997, 7, 27);     // a day of the year
var data8 = new Image();         // only in browsers

Firstly, the familiar primitive types can be treated like Objects:

var data1 = new Number("5");
var data2 = new String("Anything");

For the Number type, this is nearly useless, but String values have a bit of Jekyll and Hyde about them. On the one hand, a String is just a humble piece of text surrounded by quotes—unchangeable. On the other hand, it's a complex object with a heap of methods that let you search, convert, split and otherwise prod it in a number of useful ways as shown in line 3. JavaScript automatically converts primitive Strings to String objects, so it's all fairly invisible to the script writer. The Reference Section describes all the methods for the String type.

Secondly, Functions are Objects:

var data4 = new Function("a, b", "return (a<b) ? a : b;");  // return lesser value
data4(3, 5);

This is only useful for advanced stuff, but if you're desperate to create a function without a name, line 5 shows how.

Thirdly, Arrays are Objects:

var data = new Array(2);
data.0 = "red";            // same as data[0]
data.1 = "blue";            // same as data[1]

var data5 = new Object;
data5["shape"] = "square";      // same as data5.shape
data5["old cost"] = 10.95;      // same as data5.old cost (but that's an error)

The familiar syntax for getting at Array elements is interchangeable with the Object property syntax. Arrays are just Objects with one special difference—the length property of an Array exists and is kept up-to-date automatically by JavaScript. Objects have no automatically updated length property. Similarly, Objects are Arrays. The Array syntax for getting at elements can be used to get at Object properties, except since property names aren't numbers, a string is used inside the square brackets. This is especially handy if the property name contains spaces, or you don't know what the property name is at the time. Objects and Arrays are interchangeable; you can add properties to Arrays and Array elements to Objects, as well as the normal way around. Nevertheless, you only get the length property with an official Array, and it won't count non-element properties.

Fourthly, there are some really useful objects:

var data6 = Math.round(3.45);      // equals 3
var data7 = Date(1997, 7, 27);     // a day of the year
var data8 = new Image();         // only in browsers

The example illustrates the Math and Date kinds of Objects. These are the only two native JavaScript types not yet discussed. Both contain a host of methods for doing (surprise) mathematical and date-time calculations. Math is also a rare example of a built-in JavaScript Object. Built-in objects never need to be created with 'new' before use—one always exists for you to work with.

Fifthly, Objects are the most common way of accessing host features, as the last line of the example shows. Nearly all of the interesting bits of a Web browser look like JavaScript Objects. So Objects it is. Since this nearly brings the discussion of JavaScript native language features to a close, only the word Object appearing with its self-important initial capital letter will stand in future for the plain, native JavaScript type. A type does not describe a piece of data, a type describes a variety of data. The more humble word 'object' will be used to cover any bit of data that operates roughly like an Object, having methods properties, and so on. This is also applies to Arrays/arrays.

Finally, the biggest secret of Objects is that there's always one around you. A given script might look like it just contains plain variables, but these variables are really properties of some object. In ECMAScript, this is the magic global object that you can't see or touch. In browser-hosted JavaScript, each window is an object that contains as properties any variables you care to make up. Every variable is a property of some object—it's just a matter of finding it.