TOC
The Basics:

Variables

A truly essential part of programming is variables. Think of them as storage spaces, where you can keep a piece of information, like a number, a date or a piece of text, for later use. You wouldn't get far without this ability, and of course variables can be used in JavaScript as well.

A variable is declared using the let keyword, or if you're an old-school JavaScript developer like me, with the var keyword. Both can be used, but there are small differences, which we'll discuss later on - for now, just stick to the new version called let.

A variable declaration consists of the keyword let, followed by the name of the variable (you get to decide that one), like this:

Declaring and using variables

let age;

This simply tells the interpreter that a variable exists, with the name "age". It doesn't yet have a value, but after declaring it, you can assign a value to it, like this:

let age;
age = 42;

Of course, if you already know what value the variable should hold, you can assign it at the same time as declaring it, like this:

let age = 42;

You can even declare multiple variables, with different values, in the same line - just separate with a comma:

let name = "John Doe", age = 42, mail = "john@doe.com";

After declaring one or several variables, you can use them and change them however you want to. Here's an example:

let name = "John Doe", age = 42;

document.write("My name is: " + name + " and today is my birthday");
age = age + 1;
document.write("I am now " + age + " years old");

In this example, I declare two variables and then start using them. I simply output the name, but then I change the age and then output that as well. As you can see, it's pretty simple.

Naming a variable

As mentioned, you get to decide what your variable is called. There are a couple of rules though:

  • The variable name may only contain letters, digits and/or two special characters: The $ (dollar sign) and the underscore (_)
  • The variable name can't start with a digit
  • You can't use any of the keywords/reserved words as they are, but they can be a part of the variable name. So for instance, "break" is a keyword, meaning your variable can't be called "break", but it CAN be called "lunchBreak"

When naming more complex variables in JavaScript, camelCasing is commonly used. This means that the first word starts in lowercase, while the rest of the words starts with capital letters. Here's a couple of examples of this:

let userMailAddress = "john@doe.com";
let aLongVariableNameWithManyWords = 42;

Bear in mind though that this is just a guideline - you a free to do whatever you want, including all lowercase or uppercase letters. Just remember that JavaScript is case-sensitive, so if you declare a variable called "NAME", don't expect to be able to reference it by "name".

Constants

We just learned that you can assign a value to a variable whenever you want to, and change the value whenever you want to. But sometimes, you want to declare a variable, assign a value to it immediately, and then never allow anyone to change the value. For this purpose, we have constants. They look just like variables, but they use the const keyword instead of var or let:

const answerToEverything = 42;

Notice that I immediately assign a value to the constant - unlike with variables, you can't declare a constant without assigning a value to it. And because it's a constant, it can't be changed - the interpreter will immediately throw an error if you try to:

const answerToEverything = 42;

// Won't work - it's a constant!
answerToEverything = 43;

If you try to do the above, you will get an error like this:

Uncaught TypeError: Assignment to constant variable.

It can be really useful to have variables that can't be changed by you or anyone else, because some things should simply not be changed. For this reason, JavaScript itself comes with plenty of constants, e.g. Math.PI:

// A constant - it can't be changed!
Math.PI = 42;
// 3.141592653589793
alert(Math.PI);

Summary

Think of variables as nicely sorted storage boxes with labels on them: You can store any piece of information in a variable and name it accordingly, so that you can later access and/or modify the contents of the variable. Variables are such an important part of programming and you will see them being used in a lot of the examples through this tutorial, and even more so in the real world, when you start writing code for yourself.


This article has been fully translated into the following languages: Is your preferred language not on the list? Click here to help us translate this article into your language!