'Personalized JavaScript': User-defined functions, objects, and methods

How to take full advantage of JavaScript by moving beyond its built-in commands

By Gordon Mccomb, JavaWorld.com, 09/01/96

Since JavaScript is based on objects, a JavaScript function can easily be turned into an object, and a method for that object. So, not only can you create user-defined objects to do your bidding, you can create your own objects that behave in exactly the way you want. And you can create methods that act upon those objects. While this sounds powerful -- and it is -- the process of creating functions, objects, and methods is very easy in JavaScript.

Introducing functions

Use the function statement to create your own JavaScript function. The bare-bones syntax is:

function name (params) {
    ... function stuff...
}

• name is the unique name of the function. All function names in a script must be unique.
• params is one or more parameter variables you pass to the function.
• function stuff is the instructions carried out by the function. You can put most anything here.

Notice the { and } brace characters; these define the function block, and are absolutely necessary. The braces tell JavaScript where a function begins and ends. The parentheses around the parameters also are required. Include the parentheses even if the function doesn't use parameters (and many don't).

Names for your user-defined functions are up to you, just as long as you use only alphanumeric characters (the underscore character _ also is permitted). Function names must start with a letter character, but can include numbers elsewhere in the name.

I've stuck with the JavaScript style of function name capitalization -- that is, initial lower case, then upper-case characters if the function name is composed of composite words. For example, myFuncName, yourFuncName, or theirFuncName. Function names are case-sensitive; be sure to use the same capitalization when you refer to the function elsewhere in the script. JavaScript considers myFunc different from Myfunc.

To differentiate between functions and variables, I prefer to give my variables initial upper case characters, such as MyStuff. This immediately differentiates it from a function, which would use a the capitalization myStuff. Of course, you are free to adopt any capitalization scheme you wish.

Defining and using a function

The best way to describe the how and why of a function is to show a simple one in action. Here's a basic function that displays "Hello, JavaScripters!" and is an obvious takeoff on the "Hello World!" example you see for new programming languages.

function basicFunction () {
    alert ("Hello JavaScripters!");
}

This merely defines the function. JavaScript will do nothing with it unless the function is referenced someplace else in the script. You have to call the function in order to use it. Calling a user-defined function is the same as calling a built-in JavaScript function -- you merely provide the name of the function in your script. This serves as the function call. When JavaScript encounters the function call, it dashes off to complete whatever instructions are in that function. When the function is over, JavaScript returns to the point immediately after the function call, and processes the remainder of the script.