Javascript Basics - Variables...

Hello coders... How are you all? Hope you are doing well. Welcome back to a new article that I am going to present to you, Javascript Variables. In this tutorial, you will learn about JavaScript variables and constants, and also how to initialize and use them with the help of examples.

Declare a Variable

In JavaScript, a variable can be declared using var, let, const keywords.

• var keyword is used to declare variables since JavaScript was created. It is confusing and error-prone when using variables declared using var.

• let keyword removes the confusion and error of var. It is the new and recommended way of declaring variables in JavaScript.

• const keyword is used to declare a constant variable that cannot be changed once assigned a value.

JavaScript Variables

In programming, a variable is a container (storage area) to hold data. For example,

let num = 5;

Here, num is a variable. It's storing 5. And we declare it via let keyword.

JavaScript Initialize Variables

We use the assignment operator = to assign a value to a variable.

let x;
x = 5;

Here, 5 is assigned to variable x.

We can also initialize variables during its declaration.

let x = 5;
let y = 6;

In JavaScript, it's possible to declare variables in a single statement.

let x = 5, y = 6, z = 7;

The multiline variant is a bit longer, but easier to read.

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

Some people 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 variants do the same thing. So, it's upon us how we use it.

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 – 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

Case matters

Variables named apple and APPLE are two different variables.

var instead of let

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, “old-school” 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 chapter The old "var".

JavaScript var Vs let

Both var and let are used to declare variables. However, there are some differences between them.

Note: It is recommended we use let instead of var. However, there are a few browsers that do not support let.

JavaScript Constants

The const keyword was also introduced in the ES6(ES2015) version to create constants. For example,

const x = 5;

Once a constant is initialized, we cannot change its value.

const x = 5;
x = 10;  // Error! constant cannot be changed.
console.log(x)

Simply, a constant is a type of variable whose value cannot be changed.

Also, you cannot declare a constant without initializing it. For example,

const x;  // Error! Missing initializer in const declaration.
x = 5;
console.log(x)

What we learn till now?

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 we 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.

Thanks for reading...