Categories:

Variable and expression shortcuts

While this tutorial may not be as "flashy" as "Creating a window remote control" or "I'll have a double combo please", it can be just as interesting and useful, for the JavaScript geek, that is (just kidding). In this tutorial, I'll discuss a few simple shortcut techniques the average JavaScripter can use when it comes to declaring variables or coding certain JavaScript expressions. Wake up!

Declaring many variables at once

Probably the most frequently done thing in programming is declaring variables. Whatever you do, however you do it, you can't live without these "containers". Most of us JavaScripters are probably used to declaring variables by using the "var" keyword in front of each variable we wish to declare, like this:

var Sam
var Joe
var Bob
var Mary

There is actually a quicker way when it comes to declaring multiple variables, and it looks like this:

var Sam, Joe, Bob, Mary

Simply use "var" once, followed by the names of the variables, each separated by a semicolon. You can also choose to initialize some/all of the variables upon declaration this way:

var Sam="10yr", Joe="30yr", Bob="15yr", Mary="21yr"

Assignment operator shortcuts

If you write scripts that involve a lot of basic math operations (+-*/), you'll want to know the assignment operator shortcuts:

Operator: Translation:
x++ x=x+1
x-- x=x-1
x+=y x=x+y
x-=y x=x-y
x*=y x=x*y
x/=y x=x/y

Using these operators, you can replace expressions like:

x=x+y

with simply

x+=y

Quite handy, wouldn't you say?

The "with" statement

The "with" statement is created to save you a few key strokes when you're writing out a JavaScript object repeatedly. Take a look at the below example:

<script type="text/javascript">
document.write('Hi there, how are you?")
document.write('Fine, thanks. And you?')
document.write('Great!')
</script>

This is a short excerpt from a children's textbook (not that I'm still reading that kind of books), and a perfect illustration of an object being repeatedly written out to accomplish something. I used the document object three times to write out three lines of text. There is actually a way to cut the former "three" to just "one", and that is by using the "with" statement:

<script "text/javascript">
with (document){
	write('Hi there, how are you?")
	write('Fine, thanks. And you?')
	write('Great!')
}
</script>

By using the with statement, everything that falls inside of its brackets ({ }) default to the object specified in it's parameter. That way, you only need to type the object name once.

Remember, the "with" statement can be used with any JavaScript object to avoid having to repeatedly write the object out when referencing it multiple times.

The "?" conditional expression statement

Finally, let me show you a shortcut technique for compressing those often-used if-else statements. A default if-else statement spans four lines, like below:

<script "text/javascript">
if (navigator.appName=="Netscape")
	alert("Netscape user!")
else
	alert("IE user!")
</script>

The "?" conditional statement allows you to compact that into just one line, and has the following syntax:

(condition) ? doiftrue : doiffalse

Let's shove our four line code into the compression chamber, shall we?

(navigator.appName=="Netscape") ? alert("Netscape user!")  : alert("IE user!")

You can expand the number of possible values to assign to more than just two. In fact, there is no limit. Observe the below example, which has 3 possible values:

var browser=(navigator.appName.indexOf("Microsoft")!=-1)? "IE" : 
    (navigator.appName.indexOf("Netscape")? "NS" : "Not IE nor NS"
Here "browser" will contain one of 3 possible values depending on the browser maker of the visitor.

And for the sake of efficiency, it's time to wrap up this tutorial.