If you're coming from another language knowing what objects and classes are, JavaScript's own version of objects and classes can be a little frustrating at first. The object architecture in JavaScript is quite different from other languages. But that's not to say it isn't useful or powerful; in fact, it is.

In this article, I'll show you how to use objects in JavaScript. I'm assuming you're familiar with the fundamentals of JavaScript, such as what functions are, variables are, and so on. I'm also assuming you're familiar with the notions of Object-Oriented Programming.

Almost everything is an object

First off, it's important to understand that almost everything in JavaScript is an object. Take a look at the following code:

var a = 10;
function DoSomething(a) {
    alert(a);
}
DoSomething(a);

Not much to that; this code is just a variable declaration, then a function that displays an alert box, and finally a line of code that calls the function, passing the value of the variable.

But JavaScript is parsed and interpreted line-by-line (or, more accurately, statement-by-statement). When the JavaScript interpreter runs the first statement in this code, the variable declaration, the DoSomething function doesn't even exist yet.

After running the first statement, the variable declaration, the JavaScript interpreter runs the next statement, which is the function declaration. What do I mean by "running" a function declaration? I mean that the JavaScript interpreter will create the function, that's all. The interpreter won't run the code inside the function (so the alert box won't get displayed), but the interpreter will create the function itself.

The third statement is where we call the function (which now exists). The interpreter runs the function call, and in turn runs the code inside the function. Now the alert box displays.

Why am I being so precise here? Because the key here is how JavaScript creates the function. In doing so, JavaScript creates an internal object containing information about the function. This internal object represents the function itself, and includes the function's name and the function's code, as well as a few other tidbits we'll look at shortly.

This object representing the function is a function object, and the object's name is, in this case, DoSomething.

See how that works? By declaring a function, we're actually creating an object of type function.

You can follow the code above with a line like this:

alert(DoSomething);

What will that do? Notice we're not passing anything to the function; there are no parentheses after DoSomething (the closing parenthesis goes with the alert call). By not putting ( ) after DoSomething, we're not calling the function; instead, we're referring to the function itself.

So we're going to pop up an alert box, and display the value of the DoSomething object. What is the value of this object? Hmm. Let's find out. To do this, we need to actually try out the code in our browser. We'll take that up next.