X
HOME HTML CSS JAVASCRIPT SQL PHP JQUERY ANGULAR BOOTSTRAP XML ASP.NET MORE...
REFERENCES | EXAMPLES | FORUM | ABOUT

JavaScript Variables


JavaScript Variables

JavaScript variables are containers for storing data values:

Example

var x = 5;
var y = 6;
var z = x + y;

Try it Yourself »

From the example above you can expect:

  • x stores the value 5
  • y stores the value 6
  • z stores the value 11

Much Like Algebra

x = 5
y = 6
z = x + y

In algebra we use letters (like x) to hold values (like 5).

From the expression z = x + y above, we you calculate the value of z to be 11.

In JavaScript these letters are called variables.

As with algebra, JavaScript variables can be used to hold values (x = 5) or expressions (z = x + y).

Note JavaScript variables are containers for storing data values.


JavaScript Identifiers

All JavaScript variables (and JavaScript functions) must be identified with unique names.

These unique names are called identifiers.

Identifiers can be short names (like x and y), or more descriptive names (age, sum, totalVolume).

The general rules for constructing a names for variables (unique identifiers) are:

  • Names must begin with a letter
  • Names can also begin with $ and _ (but we will not use it)
  • Names can contain letters, digits, underscores, and dollar signs.
  • Names are case sensitive (y and Y are different variables)
  • Reserved words (like JavaScript keywords) cannot be used as names
Note Both JavaScript keywords and JavaScript identifiers are case-sensitive.


The Assignment Operator

In JavaScript, the equal sign (=) is an "assignment" operator, is not an "equal to" operator.

This is different from algebra. The following does not make any sense in algebra:

x = x + 5

In JavaScript, however it makes perfect sense: Assign the value of x + 5 to the variable x.

In reality: Calculate the value of x + 5. Then put the result into the variable x.

Note The "equal to" operator in JavaScript, is written like == or ===. You will see it soon!


JavaScript Data Types

JavaScript variables can hold many types of data, like text values (person = "John Doe").

In JavaScript texts are called strings or text strings.

JavaScript can handle many types of data, but for now, just think of numbers and strings.

When you assign a string value to a variable, you put double or single quotes around the value.

When you assign a numeric value to a variable, you do not put quotes around the value.

If you put quotes around a numeric value, it will be treated as a text string.

Example

var pi = 3.14;
var person = "John Doe";
var answer = 'Yes I am!';

Try it Yourself »


Declaring (Creating) JavaScript Variables

Creating a variable in JavaScript is called "declaring" a variable.

You declare JavaScript variables with the var keyword:

var carName;

After the declaration, the variable is empty (it has no value).

To assign a value to the variable, use the equal sign:

carName = "Volvo";

You can also assign a value to the variable when you declare it:

var carName = "Volvo";

In the example below, we create a variable called carName and assign the value "Volvo" to it.

Then we "output" the value inside an HTML paragraph with id="demo":

Example

<p id="demo"></p>

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

Try it Yourself »

Note It's a good programming practice to declare all variables at the beginning of a script.


One Statement, Many Variables

You can declare many variables in one statement.

Start the statement with var and separate the variables by comma:

var lastName = "Doe", age = 30, job = "carpenter";

Your declaration can also span multiple lines:

var lastName = "Doe",
age = 30,
job = "carpenter";

In JavaScript you can always separate statements by semicolon, but then you cannot omit the var keyword.

Wrong:

var lastName = "Doe"; age = 30; job = "carpenter";

Right:

var lastName = "Doe"; var age = 30; var job = "carpenter";


Value = undefined

In computer programs, variables are often declared without a value. The value can be something that has to be calculated, or something that will be provided later, like user input. Variable declared without a value will have the value undefined.

The variable carName will have the value undefined after the execution of the following statement:

var carName;


Re-Declaring JavaScript Variables

If you re-declare a JavaScript variable, it will not lose its value:.

The value of the variable carName will still have the value "Volvo" after the execution of the following two statements:

var carName = "Volvo";
var carName;


JavaScript Arithmetic

As with algebra, you can do arithmetic with JavaScript variables, using operators like = and +:

Example

var y = 5;
var x = y + 2;

Try it Yourself »

You can also add strings, but strings will be concatenated (added end-to-end):

Example

var y = "5";
var x = y + 2;

Try it Yourself »

Note that if you add a number to a string, both will be treated as strings.

You will learn a lot more about arithmetic operators later in this tutorial.


JavaScript Identifiers

In a programming language, all variables must be identified with unique names.

These unique names are called identifiers.


Try it Yourself Summary

Declare a variable, assign a value, and display

Declare variables, assign values, and display

Create variables of different types

Add two numbers

Add two strings



Your suggestion:

Close [X]

Thank You For Helping Us!

Your message has been sent to W3Schools.

Close [X]
Search w3schools.com:

WEB HOSTING

UK Reseller Hosting

WEB BUILDING

Download XML Editor FREE Website BUILDER Free HTML5 Templates

SHARE THIS PAGE

facebook