JavaScript Variables

Variable means anything that can vary. In JavaScript, a variable stores data that can be changed later on.

In JavaScript, variables are used to store data values that can be reused and manipulated throughout your code. JavaScript provides three main ways to declare variables: var, let, and const. Each has different behaviors depending on scope and reassignability.

Declare a variable

In JavaScript, a variable can be declared using var, let, const keywords.

• var keyword is used to declare variables since JavaScript was created. It is confusing and error-prone when using variables declared using var.
• let keyword removes the confusion and error of var. It is the new and recommended way of declaring variables in JavaScript.
• const keyword is used to declare a constant variable that cannot be changed once assigned a value.



Here, we will use the let keyword to declare variables. To declare a variable, write the keyword let followed by the name of the variable you want to give, as shown below.




Example: Variable Declaration

let myvariable;// declaration a variable without assigning a value

In the above example, var myvariable; is a variable declaration. It does not have any value yet. The default value of variables that do not have any value is undefined.

You can assign a value to a variable using the = operator when you declare it or after the declaration and before accessing it.




Example: Variable Initialization

let myvariable;
myvariable = "Welcome to JavaScript!"; // assigning a string value

In the above example, the msg variable is declared first and then assigned a string value in the next line.

You can declare a variable and assign a value to it in the same line. Values can be of any datatype such as string, numeric, boolean, etc.




Example: Variable Declaration and Initialization

let name = "Lovely"; //assigned string value
let num = 100; //assigned numeric value
let isActive = true; //assigned boolean value

Multiple variables can be declared in a single line, as shown below.




Example: Multiple Variables

let name = "Rita", num = 100, isActive = true;

You can copy the value of one variable to another variable, as shown below.




Example: Copy Variable

let num1 = 100;
let num2 = num1;

JavaScript allows multiple white spaces and line breaks when you declare a variables.




Example: Whitespace and Line Breaks

let name = "Steve",
num = 100,
isActive = true;

Variable names are case-sensitive in JavaScript. You cannot declare a duplicate variable using the let keyword with the same name and case. JavaScript will throw a syntax error. Although, variables can have the same name if declared with the var keyword (this is why it is recommended to use let).




JavaScript Variable Nameing Conventions

• Variable names are case-sensitive in JavaScript. So, the variable names msg, MSG, Msg, mSg are considered separate variables.
• Variable names can contain letters, digits, or the symbols $ and _.
• A variable name cannot start with a digit 0-9.
• A variable name cannot be a reserved keyword in JavaScript, e.g. var, function, return cannot be variable names.



Dynamic Typing

JavaScript is a loosely typed language. It means that you don't need to specify what data type a variable will contain. You can update the value of any type after initialization. It is also called dynamic typing.

Example:Loosely Typed Variable
let myvariable = 1; // numeric value
myvariable = 'one'; // string value
myvariable = 1.1; // decimal value
myvariable = true; // Boolean value
myvariable = null; // null value




Constant Variables in JavaScript

Use const keyword to declare a constant variable in JavaScript.

• Constant variables must be declared and initialized at the same time.
• The value of the constant variables can't be changed after initialized them.



Example constant variables:

const num = 100;
num = 200; //error


const name; //error
name = "Steve";

The value of a constant variable cannot be changed but the content of the value can be changed. For example, if an object is assigned to a const variable then the underlying value of an object can be changed.




Example: Constant Variables

const person = { name: 'Kunal'};
person.name = "Raj";
alert(person.name); //Bill

It is best practice to give constant variable names in capital letters to separate them from other non-constant variables.




Variable Scope

In JavaScript, a variable can be declared either in the global scope or the local scope.




Global Variables

Variables declared out of any function are called global variables. They can be accessed anywhere in the JavaScript code, even inside any function.




Local Variables

Variables declared inside the function are called local variables of that function. They can only be accessed in the function where they are declared but not outside.

The following example includes global and local variables.




Example:Global and Local Variable

let greet = "Hello " // global variable

function myfunction(){
let msg = "JavaScript!";
alert(greet + msg); //can access global and local variable
}

myfunction();

alert(greet);//can access global variable
alert(msg); //error: can't access local variable




Declare Variabls without var and let keywords

Variables can be declared and initialized without the var or let keywords. However, a value must be assigned to a variable declared without the var keyword.
The variables declared without the var keyword become global variables, irrespective of where they are declared. Visit Variable Scope in JavaScript to learn about it.
It is Recommended to declare variable using the let keyword.




Example: Variable Declaration Without var or let Keyword

function myfunction(){
msg = "Hello JavaScript!";
}
myfunction();
alert(msg); // msg becomes global variable so can be accessed here