Javascript variables - var, let and const.

Sat, 16 December 2017
3 min read

Javascript variables are containers that holding pieces of data.

There are three keywords used when declaring variable in Javascript, namely var, let and const. They follow this pattern or syntax var variableName = variableValue;.

Javascript variables are dynamic typing mean that they can change from one data type to another. Below, the variable fullName change from string to number and then boolean.

var fullName = 'Frugence Fidel'; // Frugence Fidel
fullName = 100; // 100
fullName = false; // false

Temporal Dead Zone

You cannot access the variable before you define it.

console.log(fullName); // Uncaught ReferenceError: fullName is not defined
var fullName = 'Frugence Fidel';

Ways or styles for naming variables

I known three ways of naming variables. If there are other let me known.

  1. kebab-case

    var full-name = 'Frugence Fidel';

  2. snake_case

    var full_name = 'Frugence Fidel';

  3. camelCase

    var fullName = 'Frugence Fidel';

It's recommanded to use camelCase, but if you prefer other naming style no problem, it make no difference.

Three ways of declaring variables

var

This was the only way to declare variable before ES6. Here you can declare the same variables more than one time and can be updated.

var myFriend = 'Baraka';
var myFriend = 'Peter';
console.log(myFriend); // 'Peter'

If you declare variable inside the block statement, the variable will leak outside.

var bodyWeight = 50;
if (bodyWeight > 49) {
  var water = 1.4;
  console.log(
    `For body weight of ${bodyWeight}kg, you should drink water atleast ${water}litre`
  );
}
console.log(water); // 1.4

let and const

let and const are the new ways for declaring variables introduced in ES6. In let and const you cannot declare the variable twice.

let myFriend = 'Baraka';
let myFriend = 'Peter'; // Uncaught SyntaxError: Identifier 'myFriend' has already been declared

In most case let and const are almost same, the only difference I known, const cannot be updated but let can.

// let can be updated
let myFriend = 'Baraka';
myFriend = 'Peter';
console.log(myFriend); // Peter
// const cannot be updated
const otherFriend = 'Patrick';
otherFriend = 'Raphael'; // Uncaught TypeError: Assignment to constant variable.

The variable is not leaked outside of the block statement if you use let or const.

const bodyWeight = 50;
if (bodyWeight > 49) {
  const water = 1.4;
  console.log(
    `For body weight of ${bodyWeight}kg, you should drink water atleast ${water}litre`
  );
}
console.log(water); // Uncaught ReferenceError: water is not defined

When to use var, let and const

Always use const when declaring variable, use only let when you want update the variable. var shouldn't be used in ES6 and above.