Expressing yourself in JavaScript

Find out how you can use expressions to make your scripts think on their own

By Gordon Mccomb, JavaWorld.com, 04/01/97

This explanation may sound complex, but as you will soon see, an expression is really nothing more than a simple formula for addition. This column addresses the use of expressions in JavaScript, both for defining the content of variables, as well as for creating more elaborate schemes using other JavaScript constructs. Used in this way, expressions provide a way for your scripts to think on their own (although they may seem to act on their own more than you'd like them to!).

As with all modern programming languages, JavaScript expressions can be divided into several distinct categories: assignment, math, and relational. Assignment expressions assign values to variables; math expressions apply to number values only, with one exception, which we'll get into later on; and relational expressions apply to numbers and, in some cases, strings.

We're going to be examining each of these categories in detail, so we better get started. We'll begin with the assignment expressions and the operators used within these expressions.

Assigning values to variables

The following table describes the assignment operators. You will probably use the = assignment operator for the bulk of your JavaScript programs, but it's nice to know the others are available in case you need them.

Note that JavaScript supports additional operators for bitwise operations. We'll discuss bitwise operators later in this column.

The first operator in the table, the = assignment operator, lets you assign a new value to variable. If the variable previously contained a value, that value is replaced. Take a look at the following examples: MyStringVar = "This is a string" // assign text to variable
MyNumverVar = 100 // assign number to variable
MyObjectVar = document.form[0] // assign document.form[0] object to variable

The remaining operators in the table are called shorthand assignment operators. These operators let you add, subtract, multiply, and divide values to values already in a variable. The most commonly used shorthand assignment operator, +=, can be used in one of two ways:

• If the value in the variable and the value to append are numbers, += adds the values.
• If the value in the variable and the value to append are strings, += combines them into one long string.

Here's how the += operator works when the values in question are numbers:

Var = 1;
Var += 5;
// Var now contains 6

You could also write the expression like this:

Var = 1;
Var = Var + 5;

Now here's how the += operator works when the values in question are text strings:

Var = "Java";
Var += "Script";
// Var now contains "JavaScript

The remaining shorthand operators let you subtract, multiply, and divide values:

• Use x -= val for subtracting x times val. This expression is equivalent to x = x - val.
• Use x *= val for multiplying x times val. This expression is equivalent to x = x * val.
• Use x /= val for dividing x into val. This expression is equivalent to x = x / val.
• Use x %= val for dividing x into val, leading the remainder (modulus). This expression is equivalent to x = x % val.

Let's look at a few examples (the variable Val contains 5 in each case):

Val -= 3        // result: 2
Val *= 3        // result: 15
Val /= 3        // result: 1.666 (etc.)
Val %= 3        // result: 2

That's all there is to assignment operators. Let's move on to math operators.

Performing calculations with math operators

The following table describes the math operators, which you use to perform mathematic calculations with one or more numbers. Note that the operands v1 and v2 are used as substitutes for actual variables/values. We'll be using this naming scheme throughout the column.

Note: In mathematical expressions, the + operator can be used in two ways. When used with numbers, the + operator adds them together. When used with strings, the + operator connects (or concatenates) the strings into a single string.

The ++ and -- operators (the increment/decrement operators borrowed from C, C++, and Java) can be used in a number of ways. The most common is v1++ where you increment the value already in v1 by 1. (Similarly, the instruction v1-- decrements the value already in v1 by 1.) You can actually use the ++ and -- operators before or after the value:

• When the operator is used after the value (postfix), JavaScript returns the original value and then increments it.
• When the operator is used before the value (prefix), JavaScript increments the value and returns the incremented result.

Take a look at the following examples. In both examples the Var variable (which is the number 10) is incremented by 1. The RetVal variable, however, contains different values because of the order JavaScript uses in incrementing and returning the value.

RetVal = Var++  // returns 10
RetVal = ++Var  // returns 11

The similar postfix/prefix technique works with the -- operator.

RetVal = Var--  // returns 10
RetVal = --Var  // returns 9

Moving right along, we come to the relational operators.

Comparing values

The following table describes the relational operators, which you use to compare two values to see if they are equal, not equal, greater than, or less than (and sometimes a combination of these).