What are Variables?

Variables in any programming language are containers of information. It is the name given to the address/location of information that is stored in the memory.

Just like in mathematics, x=10 or t=10x+c, etc, the same is in programming languages as well.

How to create variables in JavaScript?

1. var

var x=10; //creates a variable with name 'x' with value 10
var name="David" //creates a variable with name 'name' with value "David"
var countryName="India" //creates a variable with name 'countryName' with value "India"

1. let

let x=10; //creates a variable with name 'x' with value 10
let name="David" //creates a variable with name 'name' with value "David"
let countryName="India" //creates a variable with name 'countryName' with value "India"

1. const

const x=10; //creates a variable with name 'x' with value 10
const name="David" //creates a variable with name 'name' with value "David"
const countryName="India" //creates a variable with name 'countryName' with value "India"

let and const were introduced in ES6

JavaScript Identifiers

All JavaScript variables 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). Descriptive names are generally preferred.

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

• Names can contain letters, digits, underscores, and dollar signs.

• Names must begin with a letter.

• Names can also begin with $ and _.

• Names are case-sensitive (y and Y are different variables).

• Reserved words (like JavaScript keywords) cannot be used as names.

    //Creating a variable with const
    const studentName1="Harry" //allowed as it starts from a letter.
    const $money=100000 //allowed as it starts from a dollar sign.
    const _name="Kate" //allowed as it starts from underscore.
  
    const name# //not allowed as it contains a hashtag,any character other than mentioned above are not allowed.
    const new="123"// not allowed as "new" is a reserved keyword in JavaScript.
  

  It is not forced but a good practice to use camel cases for writing variable names.

  Camel case means merging two or more words with no space and starting the subsequent word with a capital letter. Example- studentName, totalMoneyGiven.

When to use Let, Const, Var?

let and const were introduced in ES6 i.e in 2015.

1. Use var for old browsers that don't support ES6. Well, most browsers today support ES6.

2. Use let when you want the data stored inside the variable to change.

3. Use const when you want the data stored inside the variable to not change and be constant throughout.

What is Scope?

Scope of a variable is like an area only where you can use the variable and not outside it. Scope determines the accessibility of variables.

Scope is a term related to variables.

Types of Scope

JavaScript has 3 types of scope:

Block scope

Function scope

Global scope

Global Scope

1. Variables declared outside any function or block have Global Scope.

   Global variables can be accessed from anywhere i.e can be accessed in a block and inside of functions.

   var, let and const can be used to create variables with Global Scope.

    let variable1=10;
    function sum(x,y){
        return variable1+x+y;}
    sum(1,2);
    //The output will be 13 as x=1 y=2 and variable1=10
    //variable1 is accessible inside the sum function as it has a global scope.
   

Function Scope

1. Variables defined inside a function are not accessible from outside the function.

   var, let and const can be used to create variables with Function Scope.

    let variable1=10;
    function sum(x,y){
      let x2=1;
        return variable1+x+y;}
    console.log(x2);
    // there will be an error in console "Uncaught ReferenceError: x2 is not defined"
    //x2 has a function scope thus not accessible outside function.
   

Block Scope

1. Before ES6 (2015), JavaScript had only Global Scope and Function Scope.

   let and const can be used to create variables with block Scope.

   Variables declared inside a { } block cannot be accessed from outside the block.

    {
      let x = 2;
    }
    // x can NOT be used here
   

   Variables declared with the var keyword can not have block scope.

   Variables declared inside a { } block can be accessed from outside the block when declared with var.

    {
      var x = 2;
    }
    // x CAN be used here
   

Difference between LET, CONST, and VAR?

Declaration

let x=1;
const y=1;
var z=1;

Redeclaration

var allows redeclaration of the variables.

let and const don't allow redeclaration of the variables.

let x=1;
const y=1;
var z=1; // z for code below this and before redeclaration will have value 1 

let x=10; //not allowed redeclaring x
const y=10; //not allowed redeclaring y
var z=10; //allowed redeclaring z and z will now be 10 for code after this.

Reassigning Value

let and var allows reassigning the values later

const doesn't allow reassigning the value later, it is fixed throughout the code.

let x=1;
const y=1;
var z=1;

x=2; //x will be changed to 2
z=2; //z will be changed to 2
y=2; //x will not change to 2, it will give error and continue to be 1

Scope

let and const can be used to create variables with block Scope.

var cannot be used to create variables with block Scope.

Hoisting

In simple words, for now, Hoisting means that you can define a variable before its declaration.

var is only capable of doing this and let, const are unable to do this.

x=1;
console.log(x);
var x;// gives 1

Thank you for reading, Have a nice day ahead.