The final four statements actually update the value stored in the "a" variable as well as the one on the left of the assignment operator. I will explain how this works by assuming that "a" starts off as 5 in each case. The statement b = ++a first adds 1 to the value in "a" and then assigns that value to "b" so both variables now contain 6. The statement c = a++ first assigns the value from "a" into "c" and then adds 1 to "a" so now "c" contains 5 and "a" contains 6. The statement d = --a subtracts one from "a" and then assigns the result to "d" so both variables now contain 4. I'll leave it for you to figure out what values "a" and "e" end up with after the last statement executes.

Combination Operators

Next we'll look at some more assignment operators. Like the basic assignment operator these also assign a new value to the variable to the left of the operator but with these the original value is not lost but is used in calculating the new value to be stored. Here are some examples:

With this version of the script we no longer have the text to be displayed contained within the document.write statement. Instead we first define a variable called hello which we assign the value "Hello World" to and then we write out the content of the variable instead of static text.

This doesn't produce any different result on the page but the differences in the code introduce you to a number of new features of Javascript. This will also allow us to insert further statements into this Javascript code at a later date that will change the value of the variable before it is displayed on the page.

The first line in this script creates our first variable. To create a variable you specify var (for variable) followed by the name that we want to use for the variable. If we want to give the variable a value straight away then we follow the name with equals (=) and then the value that we want to use. We call this initializing the variable.

It is possible to define a new variable without preceding the variable name with var. Specifying a new variable name without the var in front will still result in a variable with the specified name being created (if one doesn't already exist). I recommend however that you always use var when you intend to define a new variable. In a later tutorial I will show you how you can create two variables with the same name but different scope (this means that only one is accessible at a time and where you are in the code determines which one you are referencing). If you leave off var when defining new variables you run the risk of using an existing variable instead of defining a new one. Always specifying var when defining new variables will also reduce the possibility that the variables you use in multiple scripts on the same page will interfere with one another.

Types of Variables

Javascript supports three types of simple variables. These are text, numbers, and boolean (true or false). In this case this variable is a text variable because the value we have initialized it with is text (because it is enclosed within apostrophes). Had we wanted to define the variable as a number then we would have given it a numeric value (not enclosed in apostrophes) like this:

var mynum = 5;

We could also have defined the variable as boolean by assigning it an initial value of true or false. For example:

var smokes = false;

If you don't assign a value to the variable straight away then the type of variable that it is will be undefined until you give it a value.

You can leave a variable undefined when you don't want to assign it an initial value but a better alternative where you don't want to give the variable a value straight away is to specify that the variable doesn't have a value at all. We do this by initializing the variable with null like this:

var riches = null;

Javascript also allows you to define and use more complex data types that are defined using classes. We'll go into more detail about classes in a later tutorial but here's an example of a variable defined from a class so that you know what they look like:

var today = new Date;

Naming Variables

So what should you call your variables? The best option (at least to start with) is to use meaningful names for all of your variables. If you call your variable openingPrice then you are far more likely to remember what the field is used for when you need to modify the script at a later date than if you call it op. The only restriction on what names you can use for your variables is that you can't use reserved words and all of the characters you use in the variable names must be alphanumeric. Reserved words are words that currently (or are expected in the future) to have a special meaning in the Javascript programming language. Examples of reserved words that you have already met include "var", "true", "false", "new", and "null". You'll find a complete list of reserved words elsewhere on this site.

Note that variable names cannot contain spaces. This means that when you use multiple words in a variable name that you must either separate the words with an underscore character (the only non alphabetic and non number character that nevertheless is considered to be alphanumeric) - for example: opening_balance - or you can do as I did in the previous paragraph and capitalize the first letter of the second and subsequent words. It doesn't matter which of these two options you choose but I suggest that you use that one consistently for your variable names rather than switching between them.

Using What You Know

Suppose that you have some web page content that appears in multiple places on the page. If you will need to update that repeating content then you will need to make sure that you make the changes at each spot in the page where the content appears. If you miss one when updating it then the content will no longer repeat correctly.

If we use a Javascript variable to store the content that is to be repeated then we can write that out to the several places on the page where the content is needed. If the content needs to be changed then you change it once in the declaration of the variable and all of the repetitions will reflect that change.

Suppose that the code to be repeated reads as follows:

<p>If you have any questions about this
please <a href="mailto:me@myaddress.com">email me</a>.</p>

This code might appear under each of say five separate sections of text on your page. If your email address were to change then you would need to update each spot on the page to the new email address. If you miss one then emails sent from that link will go to the wrong address.

So let's include that text into a Javascript variable instead. We will replace the first occurrence of the code with the following Javascript:

<script type="text/javascript">
var questions = '<p>If you have any questions about this
please <a href="mailto:me@myaddress.com">email me</a>.</p>';
document.write(questions);
</script>

Note: The line commencing with is a continuation of the previous line and I have split it into two lines to make it easier to read in browsers using lower screen resolutions. When you copy the script you should place the code on this line onto the end of the preceding line.

The other copies of the same code can be replaced with the following Javascript which will use the variable value previously assigned:

<script type="text/javascript">
document.write(questions);
</script>

Learn to Program with Javascript

You do not need prior programming experience to be able to follow this tutorial series that takes you step by step through how to write your own Javascript programs. No longer will you have to rely on pre-built scripts written by others. You will be able to write your own scripts that do exactly what you want them to do.