DEV Community


Posted on • Updated on


Variables in JavaScript

In JavasScript, variables are containers in which we can accumulate some information.

There are 3 ways of declaring the variables:

  1. var(used 1995-2015);
  2. let(created in 2015);
  3. const(created in 2015).

The differences between these three types will be discussed later.

The declaration of the variable starts from the variable type, and then we write the name of the variable we want to create;

                       let name;
Enter fullscreen mode Exit fullscreen mode

For creating the names of variables in JS, there are several rules:

  • We can use letters, numbers, underscore(_), and the dollar symbol($);

  • The name must begin with a letter; _ or $;

  • The variable names are sensitive, which means small letters(y) and capital letters(Y) are different;

  • We cannot use reserved names, such as JS keywords or variable names.

After declaring the variables, we can give some values o these variables. In JS, it is called assigning. We assign a value to the variable using the = symbol:

                   let name;
                   name = value;
Enter fullscreen mode Exit fullscreen mode

Alternatively, we assign the value immediately after creating the variable:

                let name = value; 
Enter fullscreen mode Exit fullscreen mode

The value can be:

  • number:

                let name = 42; 
  • a text, which is called string in JS, and is written in double or single quotation marks ('' or ""):

                let name = "This is a string"; 
  • a boolean value, which means that variable is eather true or false:

                let name = true;

There are some differences between var, let, and const.
One difference is whether it may or may not be redeclared. Const and let can be declared only once in the same {} or globally, while var can be redeclared as many times as we want.

                  var x = 10;
                  var x = 25;
Enter fullscreen mode Exit fullscreen mode

is going to work, but

                  let x = 10;
                  let x = 25;
Enter fullscreen mode Exit fullscreen mode


                  const x = 10;
                  const x = 25;
Enter fullscreen mode Exit fullscreen mode

are going to result in an Error.
Nevertheless, const and let can be redeclared in different {}.

Another difference is whether the variables can be used before declaring. For var, it will work out, while for let and const, they should be declared before we can use them:

                     x = x + 7;
                     var x; 
Enter fullscreen mode Exit fullscreen mode

will work while

                     x = x + 7;
                     let x; 
Enter fullscreen mode Exit fullscreen mode


                     x = x + 7;
                     const x; 
Enter fullscreen mode Exit fullscreen mode

will result in an error.

One more difference between the variable declaration types is their scope. Scope determines the **visibility **or **accessibility **of variables.

Let, and const are block scope, while var is not. This means when a variable is created with let or const inside {}, it is local, and it does not work outside of the {}, but if the variable is created by var, it is created globally. Outside of the {}, when the variables are created, they are the same because they all have global scope.

So far, we have not seen any difference between the let and const. The let can constantly be reassigned with a new value, while const is constant and does not change its value.

             const PI = 3.141592653589793;
             PI = 3.14;  
Enter fullscreen mode Exit fullscreen mode

will give an Error, but

             let number = 93;
             number = 444;
Enter fullscreen mode Exit fullscreen mode

will reassign 444 to the variable number.
However, the word constant is a little misleading. For a constant variable, we cannot reassign a constant value, array, or object, but we can change the array's elements and the object's value properties.

Top comments (0)

11 Tips That Make You a Better Typescript Programmer


1 Think in {Set}

Type is an everyday concept to programmers, but it’s surprisingly difficult to define it succinctly. I find it helpful to use Set as a conceptual model instead.

#2 Understand declared type and narrowed type

One extremely powerful typescript feature is automatic type narrowing based on control flow. This means a variable has two types associated with it at any specific point of code location: a declaration type and a narrowed type.

#3 Use discriminated union instead of optional fields


Read the whole post now!