Declaring and Assigning Variables

Learn how to store values using let and const, and why you should avoid the older var keyword.

May 1, 20264 min read1 / 3

The Essentials

  1. Variables Remember Values: Use variables so you do not have to repeat the same values or complex expressions over and over.
  2. Declaration vs. Assignment: Declaring a variable (let myVar;) creates it. Assigning it (myVar = 10;) gives it a value. You can do both at once: let myVar = 10;.
  3. let vs const: Use let if the value will change later. Use const if the value should never change.
  4. Avoid var: var is the old way of declaring variables. Stick to let and const.
  5. Naming: Use camelCase for variable names. They cannot start with a number or contain spaces or special characters (except underscores and dollar signs).

So far, I have been working with values in isolation. Every time I wanted to use a string or a number, I had to type it out. When I selected an element from the DOM with document.querySelector('#board'), I had to type that whole long spell out again if I wanted to use it a second time.

Wouldn't it be nice if I could just ask JavaScript to remember a value for me, so I can use it later just by calling its name? That is exactly what variables do.

Creating a Variable

To create a variable, you need to use a special keyword. In modern JavaScript, the most common way to do this is with let.

JavaScript
let remember = "September 21";

There is a lot happening in this tiny line of code:

  1. let is the keyword that tells JavaScript, "Hey, I want to create a new variable."
  2. remember is the variable name I chose.
  3. = is the assignment operator. It tells JavaScript to assign the value on the right to the variable on the left.
  4. "September 21" is the value being remembered.
  5. ; (semicolon) tells JavaScript, "I am done with this statement."

Declaration vs. Assignment

You do not actually have to do all of this on one line. You can split it into two distinct steps: declaration and assignment.

JavaScript
let bankruptcy; // 1. Declaration bankruptcy = "I declare bankruptcy!"; // 2. Assignment

When you write let bankruptcy;, you are just declaring the variable. You are telling JavaScript to create the variable, but you have not given it a value yet.

If you ask JavaScript what the value of bankruptcy is before you assign it, it will return undefined. undefined literally means "I created the variable, but I have no definition for its value yet."

If you specifically want a variable to represent "nothingness", you should assign it the value null:

JavaScript
let myBankBalance = null;

null is a deliberate emptiness. undefined means "I forgot to give it a value" or "it does not have a value yet."

const and var

let is not the only way to create a variable. There are two other keywords you will see: const and var.

const (Constant)

If you have a value that should never change, you use const.

JavaScript
const myName = "Durgesh";

With let, I can change the value of the variable later (e.g., remember = "October 31";). With const, I cannot. If I try to reassign a const variable, JavaScript will throw an error. Furthermore, you must assign a value to a const variable at the exact moment you declare it. You cannot just write const myName;.

var (The Old Way)

You will see var in a lot of older code on the internet. It was the original way to declare variables in JavaScript. In 2015, JavaScript got a major update (ES6) that introduced let and const because var has some confusing rules about how it is scoped (which I will cover later).

For now, the rule is simple: Do not use var. Stick to let and const.

Naming Conventions

You can name your variables almost anything, but there are a few rules and strong cultural conventions.

  1. No spaces: let my variable is invalid.
  2. Cannot start with a number: let 1stPlace will throw an error.
  3. No weird characters: You cannot use emojis or symbols like ! or @.

The community standard in JavaScript is camelCase. You start with a lowercase letter, and every subsequent word is capitalized, like the humps of a camel:

JavaScript
let combinedParentsAge = 47; let theBestVariableEver = true;

Further Reading and Watching