Variables

What are Variables?

Variables in JavaScript are named containers that you assign things to. Think of them as boxes you put specific components inside. This means that every time you want to access a specific thing, instead of doing the possibly multi-line code, you can just recall the variable name that you assigned it to.

Naming Variables

Whilst you can pretty much name variables whatever you want there are some rules:

  • They must start with a letter, $, or `_
  • They must not start with a number
  • They are case sensitive for instance a variable of myvariable would be different than myVariable
  • For the most part, JavaScript variables should be written in camel case. This means that they start with a lowercase letter and instead of using spaces between each word, the next word starts with a capital letter, such as camelCaseExampleVariable. The ups and downs of the capital letters are said to resemble the humps on the back of a camel, hence the name.
  • Names cannot match a list of reserved JavaScript words that JavaScript already uses. These include break, return, and try. A full list can be seen here
  • When naming a variable, aim for a descriptive name so that you know what it is at a glance

Declaring Variables

There are three ways to declare variables in JavaScript. These are used the first time you mention the variable and is a way of telling JavaScript “Hey, look, here's a new variable I want you to remember.”

let variableName = 5;

let is the main way you will be declaring your variables. The key aspect of let is that it allows you to change the value of the variable later. Think of your health points in a video game, these will need to be updated when you take damage or heal, it wouldn't be useful if the number could never change.

const importantVariable = 1;

const is used for declaring a constant variable. This is one that will not be able to change later. This is good for defining variables you do not want to get accidentally changed such as settings or fixed numbers. You should prefer this by default and only use let for variables you know you want to change later.

Another way was var. This was the original way to define variables but as of 2015 is outdated.

Overwriting Variables

If your variable as been declared using let, it can be overwritten in future. Which is good if you want to update something such as age. To do so you just need to assign it a new value.

let ageVariable = 5;
console.log(ageVariable); // Prints "5" to the console
ageVariable = 6;
console.log(ageVariable); // Prints "6" to the console

A key aspect to keep in mind is when you reassign your variable, you can do so using it's own name which relates to the previous value which may seem counterintuitive at first.

let ageVariable = 5;
console.log(ageVariable); // Prints "5" to the console
ageVariable = ageVariable + 1; // Sets the new value to the old value + 1
console.log(ageVariable); // Prints "6" to the console
ageVariable = ageVariable + 1; // Sets the new value to the old value + 1
console.log(ageVariable); // Prints "7" to the console