Skip to main content.

Web Based Programming Tutorials

Homepage | Forum - Join the forum to discuss anything related to programming! | Programming Resources

Web Programming Desktop Reference 6in1

Chapter 23 -- JavaScript Operators

Chapter 23

JavaScript Operators Java


CONTENTS




The two types of operations in JavaScript are those that assign a value to a variable and those that create a value without an assignment.

The following expression

x = 1 + 1

has two parts. First, the expression on the right is evaluated, resulting in 2. Then, the result is assigned to the variable on the left, x. On the other hand,

1 + 1

evaluates to 2. The expression is completed but since there is no assignment operator, no assignment is made. When the rest of the expression, such as a method or function call is completed, the value is abandoned.

JavaScript includes a null value for variables that have not been assigned another value. Any attempt to use a null variable in an equation results in an error, unless it is an assignment for initializing a variable, such as
timerID = null.

Special Operators

.       //call
[]      //index
()      //member

The period is used to separate objects from their properties and methods.

Brackets are used for denoting indexes in arrays, such as form and elements.

Parentheses have two uses. First, they contain the parameters and arguments for functions and methods. Second, they are used to give order to complex equations. Although the following two equations appear to be the same, the results are different:

I = 5 * 5 + 10 //Result: 35
I = 5 * (5 + 10) //Result: 75
Usage

When processing an equation, JavaScript begins with any operators inside parentheses and works its way out until all operations are completed. For the first example, the multiplication symbol has higher precedence than the addition symbol, so JavaScript multiplies 5 times 5 and then adds 10. In the second example, the parentheses force the computation of 5 plus 10 and the result is multiplied times 5.

Unary Operators

++      //increment
-      //decrement
!       //complement
-       //unary negation

The double-plus and double-minus are used to increment or decrement single variables and can be used prefix or postfix.

Usage

When the double operator is placed in front of the variable (prefix), the operation is completed before the assignment is made. When the double operator is placed after the variable (postfix), the assignment is made to the variable on the left and then the operation is completed:

J = 1
I = J++ //I=1, J=2
I = ++J //I=3, J=3

The complement operator is used for Boolean values to reverse the value although the variable itself is not changed:

testResult = true
document.write(testResult)  //"true"
document.write(!testResult)  //"false"

Unary negation changes the sign of the variable, just as multiplying the number times-1 does.

Binary Operators

+       //addition
-       //subtraction
*       //multiplication
/       //division
%       //modulus

Binary operators need two operands. Addition, subtraction, multiplication, and division are the standard versions of these operators.

Usage

Modulus is a special division operator that only returns the remainder of the operation. For example:

I2 = 8 % 2  //returns 0
I3 = 8 % 3  //returns 2

Bitwise Operators

~       //bitwise complement
<<      //left shift
>>      //right shift
>>>     //right shift with zero fill
&       //and
^       //xor
|       //or

Bitwise operators work on variables at their lowest level: bits (0 and 1). Shift operators convert the operand on the left to a 32-bit integer, which is shifted by the number of bits specified on the right side. The logical bitwise operators convert both values to 32-bit integers before comparing them.

Usage

Bitwise complements are similar to the regular complement, only at the bit level. All bits with a 1 are changed to 0 and a 0 is changed to 1.

Left shift moves all bits to the left by the number of places on the right side of the equation filling in with 0s behind, whereas the zero-fill right shift works in the same way in the opposite direction. The standard right shift propagates the leftmost bit:

function bitShift() {
        I = -1
        for (increment = 0; increment<9; increment++) {
               document.write(I)
               I = I << 1
        }
}

The bitwise logical operators work in a slightly different way. When compared with another value, they return a value based on a bit-by-bit comparison based on Tables 4.7, 4.8, and 4.9.

Table 4.7  Boolean Operations-And (&)

Bit1
Bit2
Result
1
1
1
0
1
0
1
0
0
0
0
0

Table 4.8  Boolean Operations-Xor (^)

Bit1
Bit2
Result
1
1
0
0
1
1
1
0
1
0
0
0

Table 4.9  Boolean Operations-Or:

Bit1
Bit2
Result
1
1
1
0
1
1
1
0
1
0
0
0

For example, the 4-bit binary value of 13 is represented as 1101. The results of binary operations with 15 (binary 1111) and 0 (binary 0000) would return the following values:

bin13 = 13; //1101
bin15 = 15; //1111
bin0 = 0; //0000
document.writeln(bin13 & bin15); //results in 13 (1101)
document.writeln(bin13 & bin0); //results in 0 (0000)
document.writeln(bin13 ^ bin15); //results in 2 (0010)
document.writeln(bin13 ^ bin0); //results in 13 (1101)
document.writeln(bin13 | bin15); //results in 15 (1111)
document.writeln(bin13 | bin0); //results in 13 (1101)

Relational/Equality

<       //less than
>       //greater than
<=      //less than or equal to
>=      //greater than or equal to
==      //equal to
!=      //not equal to
?:      //conditional

A Boolean value is returned when using variables or literals with the relational/equality operators.

Usage

It is important to note the last two operators in the example above: equal to and not equal to.

A double-equal is needed so JavaScript doesn't confuse the comparison for an assignment. For not equal to, a common convention is opposing arrows (<>). In JavaScript, however, the implementation is formed by adding the complement operator.

The conditional operation is a special type of comparison that is only used with the assignment operator. It functions as an if-then statement for assigning a value:

underAge = (age=>21) ? "no" : "yes"

If the expression in the parentheses evaluates to true, then the first value is assigned to the variable. If it evaluates to false, the value after the colon is assigned.

Logical

&&      //and
||      //or

The logical operators are for comparing two Boolean values, typically other relational/equality expressions.

Usage

The logical operators work in the same manner as the bitwise and and or, only at the variable level.

In the following example, if the variable age is greater than or equal to 21 and the variable hasID is a Boolean true, then the block of statements will be executed:

if ( (age>=21) && (hasID) ) {
       ...statements...
}

Logical comparisons short-circuit before completing the right half of the expression, depending on the comparison being made:

false && anyExpression //Shorts to false
true || anyExpression //Shorts to true

Assignment

=       //assign
+=      //addition, concatenate
-=      //subtraction
*=      //multiplication
/=      //division
%=      //modulus
<<=     //bitwise left shift
>>=     //bitwise right shift
>>>=    //bitwise zero fill right shift
&=      //bitwise and
^=      //bitwise xor
|=      //bitwise or

When combined with one of the other binary operators, the assignment operator offers a convenient shorthand for updating variables.

Usage

For example, the following two statements do the same task (adding 5 to the variable shipping):

shipping = shipping + 5;
shipping += 5;

The += operator can also be used to concatenate strings:

sentence = "";
subject = "The dog";
predicate = " walked home.";
sentence += subject;
sentence += predicate;
document.write(sentence); //results in "The dog walked home."

Operator Precedence

Precedence refers to the order in which compound operations are computed. Operators on the same level have equal precedence. Calculations are computed from lef