Understanding Variables and Data Types in JavaScript

In this article, you will learn how to create and use variables and also learn about the different data types in JavaScript and how to use them.

---

A) Variables

In JavaScript, a variable is like a labeled box or container that holds a value for later use. Think of a container of grapes with a label “grapes”: the label (variable name) points to the grapes (the value) inside. Formally, a variable is a named reference to a value stored in memory. For example, you might declare a variable let name = "Koushik"; so that you can use name in your code instead of just typing the string "Koushik".

B) How to Declare a Variable

You declare variables in JS using one of three keywords: var, let, or const. For example:

var name = "Alice";
let age = 25;
const isStudent = true;
console.log(name, age, isStudent); //return Alice 25 true

var name = "Alice"; uses the old-style var keyword. Historically this was the only way to declare variables.

let age = 25; (ES6+) declares a block-scoped, reassignable variable. For example:

let count = 0;
console.log(count); // 0
count = 1;          // reassigning is allowed
console.log(count); // 1

const isStudent = true; (ES6+) declares a block-scoped constant. It must be initialized immediately and cannot be reassigned. For example:

const isStudent = true;
console.log(isStudent);   // true
isStudent = false;      // Error: Assignment to constant variable

Variables declared with var or let can be reassigned to new values as shown, but const variables cannot be changed after their first assignment.

C) Variable Assignment and Initialization

We can assign a value to a variable by using the assignment (=) operator—the variable name to the left of it, and the value to the right.

score = 1;

The code snipped above assigns 1 as the value of score , this is called variable assignment.

When we combine variable declaration and assignment in one operation, it is called variable initialization.

let score = 1;

As seen above, we declare the variable score, and immediately on the same line, assign the value 1 to it.

D) Key Differences: var vs let vs const

The three keywords mainly differ in scope and mutability:

1. var: Function-scoped (or global if outside any function). The declaration is hoisted (initialized to undefined if accessed before the var line). You can redeclare and reassign a var variable in the same scope. It's a old method to declare a variable.

2. let: Block-scoped, also hoisted, but it cannot be used before its declaration (it lives in a “temporal dead zone called TLD”). You cannot redeclare the same let name in one scope, but you can reassign it. When you reassign it then it will change the value of that variable.

3. const: Block-scoped like let, with the additional rule that it must be initialized when declared and cannot be reassigned. It also cannot be redeclared in the same scope. So you can not change its value in the same scope.

E) Reserved Words in JavaScript

We can create variables as we wish, some names are already being used within JavaScript to mean something specific. They are reserved words in JavaScript. Below are all the reserved words in JavaScript:

arguments await break case catch class const continue debugger default delete do else enum eval export extends false finally for function if implements import in Infinity instanceof interface let NaN new null package private protected public return static super switch this throw true try typeof undefined var void while with yield

You do not need to memorize these keywords. If you try to use them, you'll get an error and you'll learn to recognize and know them with experience.

---

F) Variable Data Types

Data type simply means "type of data". In JavaScript, we store values of different types in variables. Data types in JavaScript are categorized into two primary groups, namely;

1) Primitive: Number, String, Boolean, Undefined, Null, BigInt, Symbol
2) Reference: Object, Array, Function

---

G) Primitive Data Types

JavaScript has several primitive (simple) data types. The most common ones are number, string, boolean, null, and undefined. Each holds a single value:

1) Number: numeric values, e.g. let age = 30;.
2) String: text enclosed in quotes, e.g. let name = "Alice";.
3) Boolean: true/false values, e.g. let isStudent = true;.
4) Undefined: means “no value yet.” If you declare let x; without assigning it, its value is undefined. For example:

let x;
console.log(x); // undefined

5) Null: explicitly means “no value.” It’s a value you can assign to indicate emptiness. For example:

let y = null;
console.log(y); // null

Each of these primitives holds a simple value directly (without extra structure). In fact, for primitive variables, the value is stored directly in the variable’s memory slot:

---

H) Non Primitive / Reference Types in JavaScript

We talked about primitive data types, which store simple values like numbers or text. But in real applications we often need to store multiple values or complex data. For that, JavaScript provides non-primitive data types. Non-primitive types are also called reference types.

These include:
1) Object
2) Array
3) Function

These types can store collections of data or more complex structures.

---

1) Object

An object is a collection of related data stored as key–value pairs. Think of an object like a student profile card.

Example:

const student = {
  name: "Koushik",
  age: 21,
  isStudent: true
};

console.log(student.name);  //Koushik

Explanation:

• name, age, and isStudent are keys

• "Koushik", 21, true are values

Objects help organize related data in one place.

Real-world example:

const car = {
  brand: "Toyota",
  model: "Fortuner",
  year: 2023
};

---

2) Array

An array is used to store multiple values in a single variable.

Example:

const fruits = ["Apple", "Mango", "Banana"];

console.log(fruits[0]);  //Apple

Explanation:

• Arrays store values in order

• Each value has an index

• Index starts from 0

Example:

Index →   0        1        2
Value → "Apple" "Mango" "Banana"

Arrays are useful when you need to store lists of data.

Example:

const marks = [85, 90, 78, 92];

---

3. Function

A function is a reusable block of code that performs a specific task.

Example:

function greet() {
  console.log("Hello World");
}

greet();  //Hello World

Functions help avoid repeating the same code.

Example:

function add(a, b) {
  return a + b;
}

console.log(add(5, 3));   //8

---

Summary

Variables are "pointers" to values. When you mention (use) a variable anywhere in your code, the variable identifier (name) is replaced with the value it points to. It's just like calling someone's name. The name doesn't respond, the person (value) behind the name is what you hope to get as a response. This article also showed you the different data types in JavaScript and how to use them.