Learning JavaScript Programming – Variables

Learning JavaScript Programming – Variables cover image
  1. Home
  2. JavaScript
  3. Learning JavaScript Programming – Variables

Variables are used for storing values. They can be considered as building blocks of a program. JavaScript allows you to store all kinds of values in variables.

What are variables and why have them?

In simplest terms, a variable is a container of values. These values can be changed continually during the script execution. For example, if a variable contains the number 2 as value, we can change it (using operators) to contain something else. Further, we have the convenience of referring to a variable using its name.

Variable names

Once a value is stored in a variable it can be accessed using the variable name. A variable name can consist of alphanumeric characters and the underscore. It cannot begin with a numeral, though. Note that variable names are case sensitive and my_name is not the same as MY_name.

Valid variable names

Invalid variable names

JavaScript variable initialisation

You’ll recall that variables are store houses. In order for them to contain values, each variable is first assigned a memory address. Whenever the JavaScript code requires a variable it refers to this memory address and picks up the variable and its value.
The var keyword explicitly associates a variable to a memory address. This process is called initialization.

var your_name;

var total;

Here two variables, your_name and total have been initialized. However, no value has been assigned to these variables. The process of initialization just sets a memory location for a variable.
You can test for the value of an initialized variable through the alert() method. JavaScript returns the value “undefined”.

alert(your_name);

Click here to test the alert method
Note: The variable in the above alert() method is not surrounded by quotes.

Assigning values to variables in JavaScript

JavaScript allows us to initialize as well as assign values to variables in the same statement.
To assign a value to a variable we use the equal to (=) sign. Thus,

var url = "http://www.webdevelopersnotes.com/";

sum_total = 2001;

Sets the value of url to http://www.webdevelopersnotes.com/ and sum_total to 2001.
The eagle-eyed would have noticed the subtle difference in how the two variables are set. In the first statement, the value part is enclosed in quotes while the quotes are missing in the second statement. The reason is that http://www.webdevelopersnotes.com/ is text while 2001 is a number.

[The equal to sign is know as the Assignment operator in JavaScript. It acts on two operands, one on its right and the other on its left. The function of this operator is to assign or change variable values.]

When working with JavaScript variables, it’s advisable that you initialize them with the var keyword at the very beginning of the script. This will prevent unnecessary errors.

Data types

Variables store data. In JavaScript, this data can be of several types:

Was this confusing? To simplify the explanation, let’s look at the first two data types.

Numbers as data types

A number data type can be an integer or a floating-point.

Some integer values

Some floating-point values

Are floating-point numbers decimals numbers? Yes (sort of!)
What is the e doing in the last three values? e or E is an exponent and is always followed by an integer exponent value. In simple terms it means X 10 interger exponent.

3.0e10      means      3.0 X 1010
6.023e-23   means      6.023 X 10-23
34e1        means      34 X 101

Thus, floating point numbers can consists of either a decimal number or a very large or small number that is represented using the e notation.
Numeric data types can be manipulated using mathematical operators such as addition, subtraction, multiplication etc. We will look at these very shortly.

String Data Type

Any character or sting or characters enclosed in double or single quotes is a string data type.

So string data can consist solely of numerals? Yes! However, the number behaves as a string data type and not numeric data. For example, “4” + “10” is equal to “410” but 4 + 10 is 14!  (Note, the double quotes… more on this later)

Why have so many data types?

Data Types such as string, number etc. have to be treated in a different manner. For example, you can add, subtract, or multiply numbers but multiplying string data (read text) does not make sense.

We will look at this in more detail when discussing operators.
If you have understood this much, you are ready for the nest session.

JavaScript