JavaScript Variables

JavaScript Variables

A Variable

You can say that variables are simply “named storage” for data in your code. In previous versions of JavaScript there was only one way to create a variable in JavaScript — the var statement. But in the newest JavaScript versions we have two more ways — let and const.

Now, we'll create a variable using the let keyword.

let message;

Now, we will add some data into message variable by using the assignment operator =:

let message;

message = 'Hello World!'; // stored the string 'Hello world' in the variable named message

The string is now saved into the memory area associated with the variable. We can access it using the variable name:

let message;
message = 'Hello World!';

alert(message); // shows the variable content

To write better code, we can combine the variable declaration and assignment into a single line:

let message = 'Hello World!'; // define the variable and assign the value

alert(message); // Hello World!

We can also declare multiple variables in one line:

let user = 'John', age = 25, message = 'Hello';

That might seem shorter, but I don’t recommend it. For the sake of better readability, please use a single line per variable. The multiline variant is a bit longer, but easier to read:

let user = 'John';
let age = 25;
let message = 'Hello';

We can also define multiple variables in this multiline style:

let user = 'John',
  age = 25,
  message = 'Hello';

…Or even in the “comma-first” style:

let user = 'John'
  , age = 25
  , message = 'Hello';

Technically, all these variable declarations do the same thing so its personal choice what to use.

var instead oflet :

In older scripts, you may also find another keyword: var instead of let :

var message = 'Hello';

The var keyword is almost the same as let. It also declares a variable, but in a slightly different, “older” way.

There are subtle differences between let and var, but they do not matter for us yet. We’ll cover them in detail in the upcoming blogs. (Stay tuned!)

We can also change value of the variable as many times as we want:

let message;

message = 'Hello!';

message = 'World!'; // value changed

alert(message);

Declaring twice triggers an error:

A variable should be declared only once.

A repeated declaration of the same variable is an error:

let message = "This";

// repeated 'let' leads to an error
let message = "That"; // SyntaxError: 'message' has already been declared

So, we should declare a variable once and then refer to it without let.

Variable naming

There are two limitations on variable names in JavaScript:

  1. The name must contain only letters, digits, or the symbols $ and_.
  2. The first character must not be a digit.

Examples of valid names:

let userName;
let test123;

When the name contains multiple words, camelCase is commonly used. That is: words go one after another, each word except first starting with a capital letter: myVeryLongName.

What’s interesting is that the dollar sign $ and the underscore _ can also be used in names. They are regular symbols, just like letters, without any special meaning.

These names are valid:

let $ = 1; // declared a variable with the name "$"
let _ = 2; // and now a variable with the name "_"

alert($ + _); // 3

Examples of incorrect variable names:

let 1a; // cannot start with a digit

let my-name; // hyphens '-' aren't allowed in the name

Note: Case matters

Variables named apple and APPLE are two different variables.

Note: Non-Latin letters are allowed, but not recommended.

Note: Reserved names

There is a list of reserved words, which cannot be used as variable names because they are used by the language itself.

For example: let, class, return, and function are reserved.

The code below gives a syntax error:

let let = 5; // can't name a variable "let", error!
let return = 5; // also can't name it "return", error!

Constants

To declare a constant (unchanging) variable, use const instead of let:

const myBirthday = '18.04.1982';

Variables declared using const are called “constants”. They cannot be reassigned. An attempt to do so would cause an error:

const myBirthday = '18.04.1982';

myBirthday = '01.01.2001'; // error, can't reassign the constant!

When a programmer is sure that a variable will never change, they can declare it with const to guarantee and clearly communicate that fact to everyone.

Summary

We can declare variables to store data by using the var, let, or const keywords.

  • let – is a modern variable declaration.
  • var – is an old-school variable declaration. Normally we don’t use it at all, but we’ll cover subtle differences from let in the chapter The old "var", just in case you need them.
  • const – is like let, but the value of the variable can’t be changed.

Variables should be named in a way that allows us to easily understand what’s inside them.

That's it for this blog folks!! Let's meet in further series of blogs.