Operators

These tutorials are about JavaScript and its use for client-side Web programming.

Operators

JavaScript has many operators and many types of operators. They can be categorized as

• arithmatic operators,
• relational operators,
• string operators,
• logical operators,
• bitwise operators, and
• a few others that don't really fit into any category.

Except for bitwise operators, we are going to look at all of these in more detail. Bitwise operators allow you to manipulate integer values at the binary level. This is not something you will need for anything but the most advanced JavaScript programs. Bitwise operations also require a strong grounding in computer logic at the level of logic gates, registers and memory addressing. We are going to stick with things you can make use of almost immediately.

Arithmatic Operators

Arithmatic operators fall into two categories, those that modify the value of an expression or set of expressions and those that take the value of one expression and assign it to another expression. These latter operators are also called assignment operators.

The following arithmatic operators are the basic math operators. They do not alter the values of their operands, and therefore need to have their result assigned to some variable in order to have any real effect.

Addition ( + )

The addition operator adds two numeric operands or concatenates two string operands. Values need to be convertible to a number to work with the addition operator.

Subtraction ( - )

The subtraction operator subtracts the value of the second operand (the one after the minus sign) from the value of the first operand (the one before the minus sign). It only works on numbers.

Multiplication ( * )

The multiplication operator multiplies the numeric values of two operands together.

Division ( / )

The division operator divides its first operand by its second operand. Division of integers that do not divide evenly will yield a floating-point result. Division by zero yields Infinity or -Infinity. The expression 0/0 evaluates to Nan.

Modulo ( % )

The modulo operator divides its first operand by its second and returns the modulus. The modulus in division is the remainder, or what is left over.

Unary Minus ( - )

The unary minus is a unary operator that negates the operand immediately following it, which is to say, converts it to its negative equivalent.

Unary Plus ( + )

This operand does nothing, but exists to balance the unary minus. No, really.

The following arithmatic operators are unary operators that modify the value of their single operand.

Increment ( ++ )

The increment operator increments the numeric value of its operand by one. If placed before the operand, it returns the incremented value. If placed after the operand, it returns the original value and then increments the operand.

Decrement ( -- )

The decrement operator decrements the numeric value of its operand by one. In other words, it counts backwards. If placed before the operand, it returns the decremented value. If placed after the operand, it returns the original value and then decrements the operand.

The rest of the arithmatic operators are assignment operators. They assign the value of the operand on the right to the operand on the left. There are two types of assignment operators. The first is the simple assignment operator. It is represented by the single equals sign ( = ). It is the assignment operator we are most familiar with.

JavaScript also allows another type of operator that perform with is called assignment with operation. What this means is that they include both a math operator and an assignment operator in one operation. What is the purpose of such an operator? Well, many expressions you will end up writing may take the form of a = a + b;, or the value of the first operand equals the value of the first operand as modified by a second operand. JavaScript allows a shorthand notation for these. a = a + b; is equivalent to a += b. The same shortcut can be applied to subtraction, multiplication, division and modulus.

• a += b; is the same as a = a + b;
• a -= b; is the same as a = a - b;
• a *= b; is the same as a = a * b;
• a /= b; is the same as a = a / b;
• a %= b; is the same as a = a % b;

Note that in each of these, the two characters form a single operator, and cannot have a space between them.

For really intensive numeric computation, which you probably won't be doing with JavaScript, the assignment with operation statement is faster than same statement with separate computation and assignment operators.

Relational Operators

Relational operators allow you to test the relationship between two operands. They can test for equality between operands. They can compare operands to determine the relationship between them. There are even relational operators that test whether one operand is a property of another or of a given class of object.

The first relational operator you should know about is the equality operator.

The equality operator is represented by the double equals sign ( == ) It is used to assess whether two operands have the same value. If they do, then it returns a value of true. Otherwise it returns a value of false.

The equality operator will do data type conversion if necessary.

All of the following statements equate to true:

'1' == '1'
'1' ==  1
'1' == true  
// true equals one when converted to a number

Note that objects and arrays are compared by reference. Two objects are only equal if they are both references to the same object. If you want to test the properties of two different objects for equality, then you have to test the properties themselves, not the object.

Different arrays are never equal, even if they contain the same information. If you want to test the elements of the arrays for equality, you have to test the individual elements.

There is also an identity operator, represented by a triple equals sign ( === ), which only equates to true when both operands have the same value and are of the same type.

'1' === '1'   // true
'1' ===  1    // false
'1' === true  // false

Equality operators also have their opposites.

The inequality operator ( != returns true where equality would return false. The non-identity operator ( !== ) returns true where identity would return false.

'1' !== '1'   // false
'1' !==  1    // true

'1' != '2'    // true
'1' != '1'    // false

(a != b) == !(a == b)

Some caveats on equality: The null value is equal to the undefined value. The NaN value is never equal to anything, including itself.

The next type of relational operator are the comparison operators. Comparison operators test the relationship, or relative order, of two values. These are:

• less than ( < )
• greater than ( > )
• less than or equal to ( <= )
• greater than or equal to ( >= )

The last two relational operators worth mentioning test for relationships among objects.

The in operator test whether the first operand is a property of the second operand.

The instanceof operator tests whether the first operand is an object of the class stated in the second operand.

String Operators

There is really only one specific string operator, although the string object has many methods you can access.

The only string operator is the concatenation operator. It is represented by the plus sign ( + ). The concatenation is a special case of operator. It is an overloaded operator, since it serves more than once function depending on context. It concatenates strings, but it also serves as the addition operator for numbers.

If you have a plus sign between a number and a string, concatenation takes precedence over addition. All other numeric operators, when one operand is a string and the other a number, will attempt to convert the string to a number. With concatenation, if one operand is a string and the other is a number, then the number will be converted to a string. This is an easy way to introduce mistakes into a program.

2 + '1' // equals '21'
2 - '1' // equals 1

When working with strings, the comparison operators test on a character by character basis, so two strings that are the same except for some trailing spaces, or a difference in capitalization, will be treated as different strings. This means that comparisons can get confusing. Note the following comparisons of 11 and 3.

// compare two strings
// the character in the first position
// of the first string is less than the
// character in the first position of the
// second string, so this equates to true
'11' < '3'       // true

// compare a string and a number
// the string is converted to a number,
// thus 11 is not less than three and the
// result is false
'11' < 3        // false

// compare a word to a number
// 'eleven' is not a number, which means
// that the result will always equate to
// false
// NaN is not only not equal to anything
// else, it is also not greater or less
//than anything else
'eleven' < 3    // false

Logical Operators

There are three logical operators. Logical operators work with boolean values. The double characters for AND and OR are important, otherwise the operators mean something else.

logical AND ( && )

The logical AND (double ampersands) compares two boolean operands and equates to true if they are both true.

logical OR ( || )

The logical OR (double vertical bars) compares two boolean operands and equates to true if either one is true.

logical NOT ( ! )

The logical NOT (exclamation point) negates the value of boolean operand, which is to say it returns true if the operand has a value of false.

Since the expressions are evaluated in order, you can speed processing time of your scripts by coding the operand most likely to be the deciding factor first. For logical AND, if either one is false, than it returns false. Therefore, the operand most likely to be false should come first. For logical OR, if either is ture, it returns true, so it makes sense to put the operand most likely to be true first.

Note that when this happens, the second operand never gets evaluated. This means you should not have any value changes in the second that may affect other parts of the code, since the expressions in the second operand may not get executed.

One Last Operator

One last useful operator is the typeof operator. It works on a single operator and returns the data type of the operand. It will return one of the following values:

• number
• string
• boolean
• object -- for objects, arrays, and null
• function
• undefined

In server-side scripting it may return other implementation dependent values.

These pages can be found at: [http://academ.hvcc.edu/~kantopet/]
Copyright 2003 -- Peter L. Kantor[kantopet@hvcc.edu]
Last Updated January 2003