JS Series: EP. (III) — May the “variables” be with you.

This is the Third article of the Javascript Starwars series So let’s get started with “variables”.

What are “variables”?

In Javascript, we treat variables as “boxes with labels”, and each box is a “named storage” for data. We can put values in these boxes to store them and access them later. Variables are also known as “identifiers”.

Why “variables”?

Might be silly to ask this question for experienced devs but isn’t it a valid one?

What is the main reason to invent variables can we write programs without variables?
The answer is yes we can but what about times when we have to use them later or share our code with someone else to read it? That’s where variables come to the rescue.

Syntax

// 3 types of declaration variables

var old = 5;

let new1 = 10;

const new2 = 15;

Rules for variable declaration

There are some rules while declaring a JavaScript variable.

1. The name must start with a letter (a to z or A to Z), underscore( _ ), or dollar( $ ) sign.
2. After the first letter, we can use digits (0 to 9), for example, value1.
3. JavaScript variables are case-sensitive, for example x and X are different variables.
4. Cannot use reserved keywords as variables like class, function, let, const, var, etc.

// Note: assuming strict mode

// Some invalid variablesvar 1luke;
let *;
var let;
const star^wars = "invalid";


// Valid variables
var luke1;
let $temp;
const CODE = 10.2;
let star_wars;

Tip: For cleaner, code don’t be afraid to use as many variables as at compile time everything will be optimized saving memory.

Case matters

Variables named apple and APPLE are two different variables.

‘Let’ vs ‘Var’ vs ‘Const’

We can declare variables to store data by using the var, let, or const keywords. In modern javascript, we use let and const only but in old times people used to declare variables with "var".

• let – It is blocked-scoped.
• var – it is function scoped. Normally we don’t use it at all.
• const – is like let, but the value of the variable can’t be changed.

Why use ‘Let and Const’ over ‘Var’

There are a few reasons we use let and const (introduced in ES6) over var.

• Let and const throw an error if the same named variable is re-declared in the same scope using them.

Example-

// assuming strict mode  
var darthVader;  

darthVader = 2; // valid  

var darthVader = "evil"; // No error - should throw error as this cause confusion & data loss  

let luke; 
const skywalker = "hero";  
let luke; // Syntax error redeclaration not allowed of same variable

• Scoping issues — var is function scoped whereas let/const are blocked scoped.

Example-

// assuming strict mode  

var galaxy = 1000; 

if(galaxy > 100) {
   var owner = "darth vader";
    console.log(`Galaxy no ${galaxy} is onwed by ${owner}`) 
}  

// "owner" accessible here i.e in outer Block scope aka Globalscope

// assuming strict mode  

var galaxy = 1000; 
if(galaxy > 100) {
  var jedi = "luke";
  console.log(`Galaxy no ${galaxy} is onwed by ${jedi}`) 
}  

// "jedi" not accessible here // Reference error will be thrown

TEMPORAL DEAD ZONE — It is the space in a program where we try to access variables before they are declared. Let’s understand for var and let/const -

console.log(death_star); // undefined   


// All space above here is "Temporal dead zone" 
var death_star = "big";

console.log(death_star); // "lego"

console.log(lego_death_star); // Reference Error   


// All space above here is "Temporal dead zone" 
let lego_death_star = "big";

So yeah, That was a quick intro about “variables” More learnings ahead…

Stay Tuned for the next Episode. Thanks.

✍️ Medium — https://codecutters.medium.com/
☕️ Buymeacoffee — https://www.buymeacoffee.com/codecutters
🦄 Hash node — https://codecutters.hashnode.dev/
❤️ Youtube — https://www.youtube.com/@codecutters/

Ya ya, you going… I know, and haven’t followed me yet? no problemo.
Just kidding Please “Like share and Follow” until your hands are tired…

ha ha ha … May the javascript be with you :)