JavaScript Variables

Variables are used to store data, such as text strings, numbers, etc.

Variables in standard JavaScript do not have an attached type, and any value can be stored in any variable.

and can be set, updated, and retrieved as needed. Typically, variables are symbolic names for values.

You can usevarKeywords create variables, while the assignment operator (=) is used to assign values to variables.

In this example, x, y, and z are variables:

var x =　20;
var y =　30;
var z = x　+　y;

JavaScript identifier

All JavaScript variables must be identified by unique names.

These unique names are called identifiers.

These are the following rules for naming JavaScript variables:

• Variable names must start with a letter, underscore (_), or dollar sign ($)

• Variable names cannot start with a number

• Variable names can only contain alphanumeric characters (A-z,0-9and underscores

• Variable names cannot contain spaces

• Variable names cannot be JavaScript keywords or reserved words

Declare JavaScript variable

Creating variables in JavaScript is called "variable declaration".

You usevarUse keywords to declare a JavaScript variable:

var city;

After declaration, the variable isundefined(No value).

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

city = "New Delhi";

You can also assign a value to a variable when declaring it:

var city = "New Delhi";

In the following example, we create a variable named city and assign the value "New Delhi" to it.

Then, we display the value in the paragraph with id="para":

<p id="para"></p>
<script>
var city = "New Delhi";
document.getElementById("para").innerHTML = city;　
</script>

Declare multiple variables at once

You can also declare multiple variables and set their initial values in a single statement. Each variable is separated by a comma.

var x =　10, y =　15, z =　5;

Declarations can span multiple lines:

var x =　10,
y =　15,
z =　5;

JavaScript variable reassignment

You can reassign a value to a JavaScript variable.

var x =　10;
document.writeln(x);
x =　50;
document.writeln(x);
x = "Helo world";
document.writeln(x);

Redefine JavaScript variable

If you redefine a JavaScript variable, it will not lose its value.

after executing the following statement, the variablecitywill still have the value "New Delhi":

var city = "New Delhi";
var city;

JavaScript data types

JavaScript variables can contain numbers (such as123) and text values (such as "Hello World").

JavaScript can handle multiple types of data, but for now, let's consider only numbers and strings.

JavaScript does not distinguish between integer values and floating-point values.

Strings are enclosed in double quotes or single quotes. Numbers are not quoted.

If a number is enclosed in quotes, it is considered a text string.

const PI =　3.14;
var msg = "Hello World";
var city = 'New Delhi';

In the later part of this tutorial, you will learn more about data types.

let and const keywords

ES6introduced two new keywordsletandconstused to declare variables.

letIt allows you to declare variables that are not limited to the block, statement, or expression on which they are used.

Block scope definition means creating a new scope within a pair of curly braces {...}.

var y =　20;
//　y here is　20
{
　　let y = "world";　　//　y here is "world"
}
//　y here is　　20

constkeywords to declare a read-only named constant.

The value of a constant cannot be changed by reassignment, nor can it be declared again.

Constants are block-scoped, very similar to usingletvariables defined by keywords.

const MY_AGE =　120;

JavaScript undefined

undefinedThe value indicates that no value has been assigned to the variable, or the variable has not been declared at all.

after executing the following statement, the variablecitywill have a valueundefined:

var city;

JavaScript variable scope

The scope of a variable is the area of the program in which it is defined. JavaScript variables have only two scopes.

• Global variables - Global variables have a global scope, which means they can be defined at any location in the JavaScript code.

• Local variables - Local variables are only visible within the function in which they are defined.

Within a function body, local variables take precedence over globally scoped variables with the same name. If you declare a local variable or function parameter with the same name as a global variable, you can effectively hide the global variable.

var myVar = "global";　　//　Declare a global variable
function checkScope() {
　　　var myVar = "local";　//　Declare a local variable
　　　document.getElementById("para").innerHTML = myVar;
}

You will learn more about variable scope in the later part of this tutorial.

JavaScript Reserved Words

The following table lists all reserved words in JavaScript.

They cannot be used as JavaScript variables, functions, methods, or any object names.