JavaScript Variables

Variables are used for storing data values. JavaScript variables are containers (placeholders) for storing values. A variable can have different values at different phases of execution. Since the content of a variable varies throughout the execution of a program, they are called variables.

Below example, x, y, and z, are variables:

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Variables</h1>

<p>In below example, num1, num2, and sum are variables</p>

var num1 = 25;<br />
var num2 = 75;<br />
var sum = num1 + num2;  // sum is 100<br /><br />
	
Sum : <span id="element"></span>

<script>
	var num1 = 25;
	var num2 = 75;
	var sum = num1 + num2;  // sum is 100
	document.getElementById("element").innerHTML = sum;
</script>

</body>
</html>

Download the code Run the code

As per above example

num1 stores the value 25
num2 stores the value 75
sum stores the value 100

JavaScript Identifiers

Javascript variables must be unique and identified by unique names. These unique variable names are called identifiers. Identifiers can be of single character (a, b, c) or with multiple characters for descriptive names (age, name, person). You can’t use a JavaScript built in keyword (such as var, if, else) as identifiers.

General programming rules are applied for constructing variables:

Variable names can contain letters, digits, underscores, and dollar signs.
Variable names must begin with a letter
Variable names can also begin with $ and _
Variable names are case sensitive (y and Y are different variables)
JavaScript Reserved words (like JavaScript keywords) cannot be used as names

Declaring JavaScript Variables

Creating a variable in any programming language is called “declaring” a variable. JavaScript variable can be declared with the var keyword:

var locationName;

After declaration, the variable has no value. It has default value of undefined. To assign a value to the variable, use the equal sign.

locationName = "Park Grove, TX";

It is also possible to assign value to a variable during declaration

var locationName = "La Cross Road";

Declaring Multiple JavaScript Variables in single Statement

It is possible to declare many variables using single var keywords. Start with var keyword and than separate each variable with comma. In below example 3 variables are declared in single statement.

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Variables</h1>

<p>You can declare many variables in one statement.</p>
var personName = "Keyur Gohel", locationName = "Ispat Bhavan, Lodhi Road", price = 200; <br /><br />

value of locationName variable is <span id="element"></span>

<script>
var personName = "Keyur Gohel", locationName = "Ispat Bhavan, Lodhi Road", price = 200; 
document.getElementById("element").innerHTML = locationName;
</script>

</body>
</html>

Download the code Run the code

undefined Value

It is possible to declare variable without value. Variable declared without any value will have undefined value. The variable location will have the value undefined after the execution of this statement:

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript Variables</h1>

<p>When a variable is declared without a value, it will have the value undefined.</p>

var locationName;<br /><br />
here locationName variable is set value of <span id="demo"></span>

<script>
var locationName;
document.getElementById("demo").innerHTML = locationName;
</script>

</body>
</html>

Download the code Run the code

<<< Javascript Data TypesJavaScript Scope of Variables >>>