Declaring Variables Guide
Tags: javascript, beginners, webdev, tutorial
Published: 2023-09-28 18:13:56

For those of you looking to start your journey into JavaScript and web development, you might find yourself defining a lot of variables. The more you learn and discover the more complex aspects of JavaScript syntax, the more you will start to run into people using different words and variables to declare variables. If you find yourself asking questions like: "what is the difference between let and var?" or "why did they declare a variable without assigning it a value?" Then, this post is for you. 

JavaScript has three main methods to declare and assign variables. Those three methods are `let`, `const`, and `var`. Which one you will use depends on the context and the scope in which you are declaring the variable. For greater understanding of how the syntax works, try coding along with the examples with [replit](https://replit.com/). [Replit](https://replit.com/) is a free code editing platform that is great for practice.

## Declaring Variables With Const 
`const` is by far the most common method for declaring variables. Const is best utilized for declaring variables that you know are not going to change as your code is executed. Variables declared with `const` cannot be redeclared or reassigned. That being the case, variables declared using this method must be defined right away. Unless you know your variable is going to change, `const` should be your go to. Especially when you start getting into more complex and longer code, it can be difficult to keep track of variables that have already been declared. Declaring variables with `const` give an added peace of mind.

```Javascript
const variable1 = 'constant variable'
console.log(variable1)
=> constant variable
const variable1 = 'redefine'
console.log(variable1)
=> SyntaxError: Identifier 'variable1' has already been declared
```

##Declaring Variables With Let
The next one up is `let`. `let` is for when you anticipate that your variable is going to change. For example, if you are using a variable as a counter value and the value is going to increment/decrement, it is a good idea to have a flexible variable. Another example might be if you want to create an empty object or array and push data to it later on. Because of the ability to be redefined, `let` variables do not need to be defined right away. With the added flexibility that comes with using `let`, make sure you are being vigilant and not redefining a variable that is being used elsewhere in a code. Redefining a variable that was not meant to be can cause issues in your code and be potentially difficult to debug. 

```Javascript
let color = 'green'
console.log(var1)
=> green
color = 'blue'
console.log(var1)
=> blue
```

##Declaring Variables With Var
The last one up is `var`. In general, it is best to avoid using this one. `var` can be tricky because it can be redeclared and redefined, allowing you to accidentally reuse the same variable over and over again, reassigning and/or redeclaring it every time. This can be problematic and difficult to debug, depending on the scope that the variable is used in.

```Javascript
var number = 'one'
console.log(number)
=> one
number = 'two'
console.log(number)
=> two
var number = 'three'
console.log(number)
=> three
```

## Scope
Another important thing to keep in mind is the scope in which a variable is declared. Variables declared in function scope do not follow the same rules as a variable declared in global scope. Global scope is when a variable is declared outside of any function and a global variable is accessible anywhere in the code. Global variables declared with const cannot be redeclared or reassigned in the global scope. 

```Javascript
const xvar = "global scope"
console.log(xvar)
=> global scope
```

Variables declared inside the scope of a function play by a different set of rules. Functions seek the definition of a variable locally before seeking it globally. What that means is that if a variable is declared inside of a function, and that variable is called back inside of the context of that function, the function is going to recognize the declaration from inside the function.

```Javascript
const xvar = "global scope"

function x() {
  const xvar = "function scope"
  return console.log(xvar)
}
x()
=> function scope
```

Conversely, if you do not have the variable defined in the context of the function, it will seek the global definition.

```Javascript
const xvar = "global scope"

function x() {
  console.log(xvar)
}
x()
=> global scope
```

As you learn more and become more comfortable with JavaScript syntax, you will come to learn what method to declare variables with. The main takeaways should be to use `const` when feasible to avoid having the possibility of changing the variable, use `let` when you know your variable is going to change, and use `var`... never. Knowing when to use which method to declare your variable will help you level up and progress on your coding journey. Now you are ready to properly declare your variables!

## Resources
[Storing the information you need — Variables](https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables)