JAVASCRIPT

The Power of JavaScript: Operators

We have discussed the very basics of Javascript. Until now, we have not written much code. There's still much more to knowing and learning to master the basics of Javascript. In this article, we talk about how we can perform arithmetic operations, comparison operations and increment/decrement operations using Javascript operators.

Author Info:

By: Michael Youssef

Poor Best

Rating:

/ 13

July 19, 2005

TABLE OF CONTENTS:

The increment (++) operator is a unary operator which is used to increment its operand by 1. You can place the increment operator to the left of its operand like this: ++x. In that position, it is called the pre-increment operator. You can also place it to the right of its operand like this: x++. In that case it is called the post-increment operator. How do these operators work? Let's take a look at the following example:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Hello World</title>
<script language="JavaScript" type="text/javascript">
var x = 1;
document.write("x = " + x + "<br>");
document.write("x = " + x++ + "<br>");
document.write("x = " + x + "<br>");
document.write("----------" + "<br>");
var y = 10;
document.write("y = " + y + "<br>");
document.write("y = " + ++y + "<br>");
document.write("y = " + y + "<br>");
</script>
</head>
<body>
</body>
</html>

Save the above code, then load it into your browser, and you will get the following values written to the Web page.

We begin the script with a declaration to the variable x, then we assign the value 1 to it. Next we simply write its value to the Web page using document.write() functionality. Note that we concatenate the string value "x = " with the x with the string value "<br>". Again the Interpreter replaces x by its value. This is what variables are all about; instead of using a value itself we place it in a place (the variable) and begin to use this variable and perform our operations that may change the value.

In the next statement note that we have used the post-increment operator with x (x++), and as you can see the value of x didn't change because the statement has written 1 to the Web page. In the next statement the value of x has became 2. What just happened? The post-increment operator simply added one to its operand, but at the execution of the next statement, not in the statement that we used the operator in. So when we used x++ the value of x was still 1 in the statement -- but it will increase by 1 at the next statement.

After the statement document.write("----------" + "<br>");, we declare the variable y and assign it the value 10. Again we use the document.write() to write the value of y to the Web page, then at the next statement we use the pre-increment operator with y (++y). As you can see, now the value of y has been increased by 1 in the statement that uses the pre-increment operator (unlike the post-increment operator). The pre-increment operator increases its operand in the same statement (not the next statement as with the post-increment operator). The next statement prints the value of y to the Web page, which is still 11.

The decrement operator (--) decreases its operand by one, and it has the post-decrement (x--) and the pre-decrement (--x) versions, which have the same effects as the post-increment and pre-increment versions.

DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware.