What is the diffence between var, let and const?
Tags: javascript, webdev, beginners, programming
Published: 2022-10-06 23:00:31

In JavaScript, there are different ways to declare a variable. These include using the keywords var, let, and const. Each of these has slightly different implications for how the variable can be used in your code.

## var

The keyword **var** is the traditional way to declare a variable in JavaScript. Variables declared with var are global variables, meaning they can be accessed from anywhere in your code. They are also function-scoped, meaning that they are only accessible within the scope of the function they were declared in. See the examples below:

**Example 1** 

**Inside the function:**
```js
function displayName() {
    var fullName = "Francisco Inoque";
    console.log(fullName)
}

namePersonal()

// Result is: Francisco Inoque

```

**Example 2** 
**Accessing the variable inside the if block from function scope:**
```js

function namePersonal() {
   
    if(true) {
        var fullName = "Francisco Inoque"
    }

    console.log(fullName)
}
namePersonal()

// Result is: Francisco Inoque
```

**Example 3** 

**Accessing the variable before being declared:**
```js
function displayName() {
    console.log(fullName)
    var fullName = "Francisco Inoque";
}

namePersonal()

// Result is: undefined

```


## let

**Let** is a newer way to create variables. It was introduced with the ES6 version of JavaScript (ECMAScript 6). Its purpose is also to create variables, but unlike var, it has some restrictions. For example, you can’t use let with the same name twice in the same scope. See the examples below:

**Example 1** 

**Inside the function:**
```js
function displayName() {
    let fullName = "Francisco Inoque";
    console.log(fullName)
}

namePersonal()

// Result is: Francisco Inoque

```

**Example 2** 
**Accessing the variable inside the if block from function scope:**
```js

function namePersonal() {
   
    if(true) {
        let fullName = "Francisco Inoque"
    }

    console.log(fullName)
}
namePersonal()

//Return Error
// Result is: ReferenceError: fullName is not defined
```

**Example 3** 

**Accessing the variable before being declared:**
```js
function displayName() {
    console.log(fullName)
    let fullName = "Francisco Inoque";
}

namePersonal()

//Return Error
// Result is: ReferenceError: Cannot access 'fullName' before initialization
```


## const 

**Const** is also a new way to declare variables introduced in ES6. The main difference between const and other ways of declaring variables is that with const you can’t change the value of the variable once it’s been declared. That is, **const** has all the characteristics of let plus some addition, which is the immutability of the assigned value. See the examples below:

**Example 1** 

**Inside the function:**
```js
function displayName() {
    const fullName = "Francisco Inoque";
    console.log(fullName)
}

namePersonal()

// Result is: Francisco Inoque

```

**Example 2** 
**Accessing the variable inside the if block from function scope:**
```js

function namePersonal() {
   
    if(true) {
        const fullName = "Francisco Inoque"
    }

    console.log(fullName)
}
namePersonal()

//Return Error
// Result is: ReferenceError: fullName is not defined
```

**Example 3** 

**Accessing the variable before being declared:**
```js
function displayName() {
    console.log(fullName)
    const fullName = "Francisco Inoque";
}

namePersonal()

//Return Error
// Result is: ReferenceError: Cannot access 'fullName' before initialization
```

**Example 4** 

**Accessing the variable before being declared:**
```js
function displayName() {
    
    const fullName = "Francisco Inoque";
    fullName = "Inoque";
    console.log(fullName)
}

namePersonal()

//Return Error
// Result is: TypeError: Assignment to constant variable.
```

## So which one should you use?

It depends on what you need and what your goal is. If you want to create a variable without any restrictions, then use var. If you want to make sure you don’t accidentally change the value of a variable later on, then use const. And if you want something in between those two extremes, then let might be what you’re looking for.