DEV Community


Posted on

VAR in Javascript

In JavaScript, the var keyword is used to declare variables. Variables declared with var have*_ function scope or global scope_*, which means they are accessible within the function in which they are defined or throughout the entire program, respectively. Here's an explanation of how var works:

1. Function Scope:
Variables declared with var inside a function are locally scoped to that function. They are not accessible outside of the function. This is known as function scope. For example:

   function greet() {
     var message = "Hello";

   greet(); // Output: Hello
   console.log(message); // Throws ReferenceError: message is not defined
Enter fullscreen mode Exit fullscreen mode

In the above example, the message variable is declared with var inside the greet function. It can be accessed within the function, but outside of the function, attempting to access it will result in a ReferenceError since it is not defined in the global scope.

It's important to note that variables declared with var inside a block (such as an if statement or a loop) are still function-scoped, not block-scoped.

2. Hoisting:
Variables declared with var are hoisted to the top of their scope during the compilation phase, which means they are moved to the top before the code is executed. This allows you to use a variable before it is declared, although its value will be undefined until it is assigned. For example:

   console.log(name); // Output: undefined
   var name = "John";
   console.log(name); // Output: John
Enter fullscreen mode Exit fullscreen mode

In the above example, the name variable is hoisted, so the first console.log statement outputs undefined. The variable is then assigned the value "John", and the second console.log statement outputs "John".

Hoisting can sometimes lead to confusion and unexpected behavior, so it's generally recommended to declare variables at the top of their scope to improve code clarity.

3. Global Scope:
When a variable is declared with var outside of any function, it becomes a global variable. Global variables are accessible throughout the entire program, including inside functions. For example:

   var age = 25;

   function printAge() {

   printAge(); // Output: 25
   console.log(age); // Output: 25
Enter fullscreen mode Exit fullscreen mode

In this case, the age variable is declared with var outside of any function, making it a global variable. It can be accessed both within the printAge function and outside of it.

4. Redeclaration and Overriding:
Variables declared with var can be redeclared within the same scope without throwing an error. This behavior can lead to potential bugs and should be used with caution. Additionally, assigning a value to a variable that has already been declared with var will simply override the existing value. For example:

   var count = 5;
   var count = 10;
   console.log(count); // Output: 10
Enter fullscreen mode Exit fullscreen mode

In this example, the count variable is first declared and assigned a value of 5. It is then redeclared and assigned a new value of 10. The output of console.log(count) is 10.

It's worth noting that the introduction of let and const in newer versions of JavaScript (ES6 and onwards) provides block scope and better scoping rules compared to var. let and const should be preferred over `var

` in most cases, as they help avoid potential issues related to variable hoisting and provide more predictable scoping behavior.

Top comments (0)