|
|
|
Variables can be compared to small boxes with names.
If you were to store 5 pair of shoes, you might have a box for each pair. On each box you would write what is in it.
- The boxes would be your variables.
- Places to store things.
- The name on the boxes would be the variable names.
- The ones you'd use when referring to each of the boxes.
- And finally the shoes, would be the content of the variables.
- What is stored in the boxes.
A variable is simply a place in the computer's memory to store information. All variables are referred to by the unique name you assigned to them.
Consider this example:
<html>
<head>
<title>My Javascript Page</title>
</head>
<body>
<script>
myname="Henrik";
document.write(myname);
</script>
</body>
</html>
|
|
This example would write "Henrik" in the document.
Note that when you want text to be stored in a variable you need to put the text in " ".
The reason is that javascript uses " " to tell the difference between text and variables.
Look at this example to see the importance of this.
<html>
<head>
<title>My Javascript Page</title>
</head>
<body>
<script>
Henrik="my first name";
myname=Henrik;
document.write(myname);
</script>
</body>
</html>
|
|
Try to predict the output of the example before reading on.
- In the first line, the text "my first name" is stored in the Henrik variable.
- In the second line, the Henrik variable is stored in the myname variable.
- Finally in line 3, the myname variable is written to the document.
The result is that "my first name" will be written on the page.
ASSIGNING VALUES TO VARIABLES
The most common way to assign a value to a variable is using the equals sign.
Consider these examples to see the different ways variables can be assigned to contain either values or text.
Note in particular how parentheses can be used to control how complex formulas are handled.
|
Example | Resulting value
| a=2;
a=2; a++;
a=2; a--;
a=2; b=3; c=a+b;
a=2; d=a+6;
First="Henrik";
Last="Petersen";
Full=First+" "+Last;
a=2*7;
b=20/5;
c=(20/5)*2;
d=20/(5*2);
| a=2
a=3 (2+1)
a=1 (2-1)
c=5 (2+3)
d=8 (2+6)
First=Henrik
Last=Petersen
Full=Henrik Petersen
a=14 (2*7)
b=4 (20/5)
c=8 (4*2)
d=2 (20/10)
|
|
ARITHMETHIC OPERATORS
The above table includes the so-called "arithmethic operators" a++ and a--.
You could really live well without these, since what they do can be achieved by using the other operators available.
However you will often see them used in scripts, and you might even be lazy enough to use them yourself, since it is faster to type a++; than it is to type a=a+1;.
|
Operator | Explanation | Example
| | ++ | increment | a=5;
a++;
a would now equal 6
| | -- | decrement | a=5;
a--;
a would now equal 4
| | % | returns modulus,
which is what is left when
two numbers are divided. | a=8 % 3;
a would now equal 2,
since 8 can be divided
by 3 two times leaving
a remainder of 2.
|
|
COMPARING VARIABLES
There are several different ways to compare variables.
The simplest is comparing for equality, which is done using a double equals sign:
if (a==b) {alert("a equals b")};
if (lastname=="Petersen") {alert("Nice name!!!")};
Note: The if statement is explained in the next section.
If you forget to use double equals signs when comparing variables for equality, and use a single equals sign instead, you will not compare the variables. What will happen is that the variable on the left side of the equals sign will be assigned the value of the variable to the right.
An example of the error:
if (lastname="Petersen") {alert("Nice name!!!")};
This is a very common bug that will totally ruin the script.
This table contains the different comparing operators:
|
Operator | Explanation | Example
| | == | equal to | 4==5 (false)
5==5 (true)
5==4 (false)
| | != | not equal to | 4!=5 (true)
5!=5 (false)
5!=4 (true)
| | < | less than | 4<5 (true)
5<5 (false)
5<4 (false)
| | > | greater than | 4>5 (false)
5>5 (false)
5>4 (true)
| | <= | less than or equal to | 4<=5 (true)
5<=5 (true)
5<=4 (false)
| | >= | greater than or equal to | 4>=5 (false)
5>=5 (true)
5>=4 (true)
|
|
On the function page you will learn more about global and local variables.
On the array page you will learn more about ways to work with large amounts of variables.
|
|
|
|
"Better Than Books - As Easy As It Gets!"