Understanding var, let, and const in JavaScript

·

3 min read

JavaScript provides three ways to declare variables: var, let, and const. Understanding the differences between them is crucial for writing clean and efficient code. This article will explore each and see where and how to use them.

  1. Let: We use let keyword to declare variables that could be changed later.

    whenever we want to mutate (change the value of a variable) variable, let is the perfect keyword.

     let age = 25;
     console.log(age); // 25
     age = 31;
     console.log(age) // 31
    
  2. Const: const is used when you don’t want the variable to change. once the value of const the variable is assigned, it can not be mutated again later in the code.

     const birthYear = 1991;
     console.log(birthYear); // 1991
     birthYear = 2000; 
     Output: "TypeError: Assignment to constant variable."
    

    - Because the const is immutable, we can not create an empty const variable. This means every const variable has to have some value assigned every time the variable is declared.

     const birthYear;
     Output: "SyntaxError: Missing initializer in const declaration"
    
  3. Var: The var is the way we used to declare variables in JavaScript. This variable should be completely avoided due to the introduction of let. However, you should know how it works because of the legacy reasons. You'd often find code with the var declaration in the older JavaScript modules. It can be considered as the old way to define the variables before ES6.

     var age = 25;
     console.log(age); // 25
     age = 31;
     console.log(age) // 31
    

    Although it looks like var and let have the same functionalities, but below the surface, they're pretty different. The biggest difference between var and let is that, let is block-scoped and var is function-scoped. (More about block-scoped and function-scoped later). For now, you should avoid using the var keyword and stick with let.

  4. Declaring variables without any keywords: It is not mandatory to use keywords when declaring the variables. Like the programming language Python, we can just define the variable name and assign any value we want and JavaScript will gladly execute the code without any issues.

     age = 25;
     console.log(age) // 25
    

    However, this is a horrible idea. this doesn't create the variable in the current "scope", JavaScript creates this variable on the global object. (More about Scope and Global Object later). Always avoid using this way to define the variables.

Should I use let or const?

For the best practice to write a clean code, it is recommended to use const by default and let if you're really sure that the variables need to change later in the future. It is the best practice to have as little variable mutation as possible.

"More mutations increase the higher potential to introduce bugs in the code"

Conclusion

  • Use var for older code, but try to avoid it in new code.

  • Use let for variables that might change value.

  • Use const for variables that should stay the same.

Understanding these basics will help you write better and more predictable JavaScript code. Happy Coding!