JavaScript Variables and Data Types Explained

Variables and data types are the building blocks of any programming language. Before writing complex programs, it is important to understand these two concepts clearly.

Let's start by defining them.

Variables

Variables are used to store values.

In JavaScript, there are three ways to create variables:

• var → variable

• let → block-scoped variable

• const → constant value

1.What is a Variable?

A variable is like a storage container that holds a value.

You can imagine it as a bucket. If we write:

let n = 10

Then there will be a container named n with the value 10 inside it.

In reality, JavaScript assigns a block of memory with the name n and stores the value 10 in it.

2.Types of Variables in JavaScript

let n // declaration (no value assigned)

let n = 10 // initialization

3.History of Variables in JavaScript

In the 6th edition of JavaScript, known as ES6, new features were introduced such as:

• let

• const

• arrow functions

• and more.

During the 1990s, var was the only way to declare variables.

However, var has some problems.

Example:

if(true){
 var a = 69
}

console.log(a) // 69

The value of a should not be accessible outside the block, but var allows it.

Another issue:

console.log(a)//undefined

var a = 69

Output: Undefined

This happens because of a behavior called hoisting.

Instead of throwing an error, JavaScript prints undefined.

If you use let or const, JavaScript correctly throws an error.

Example with const

if(true){
 const a = 69
}

console.log(a) // error

Example with let

if(true){
 let a = 69
}

console.log(a) // error

Example with var

console.log(a)

var a = 69 // undefined

This happens because let and const are block-scoped, meaning they only exist inside the block {}.

Because of these problems, modern JavaScript developers avoid using var.

Most developers follow this rule:

• Use const by default

• Use let if the value needs to change

1. let

Example:

let n = 8
n = 9

console.log(n) // 9

let allows you to modify the value of a variable.

Use let when the value may change later.

2.const

Example:

const m = 8

m = 9 // error

Once a value is assigned to const, it cannot be changed.

The biggest advantage of const is that it prevents accidental value changes.

Data Types

Data types define what type of value a variable can store.

In JavaScript, data types are mainly divided into two categories:

1. Primitive Data Types

2. Non-Primitive Data Types

Primitive Data Types

Primitive data types are basic data types that are not derived from other types.

Examples include:

• Number

• String

• Boolean

• Null

• Undefined

• Symbol

• BigInt

1. Number

In many languages, integers and floating numbers are separate types.

But in JavaScript, all numeric values come under the number type.

Example:

console.log(Number.MIN_SAFE_INTEGER)//-9007199254740991

console.log(Number.MAX_SAFE_INTEGER)//9007199254740991

let num=45
console.log(num)//45

2.BigInt

A BigInt is created by adding n at the end of the number.

mainly use for Big Numbers

Example:

let currentBalance = 69_000
console.log(typeof(currentBalance)) // number

let futureBalance = 69_000_000_000_000_000_000_000n
console.log(typeof(futureBalance)) // bigint

Underscores can be used for better readability.

Example:

Both are the same. 69000 and 69_000

2. String

A string is a sequence of characters.

Example:

let myName = "srujan"

console.log(myName)
console.log(typeof(myName)) // string

->Strings are immutable in JavaScript.

3. Boolean

Boolean values can only be true or false.

Example:

let areYouSingle = true
console.log(typeof(areYouSingle))

let areYouMarried = false
console.log(typeof(areYouMarried))

4. Undefined

When a variable is declared but no value is assigned, it becomes undefined.

Example:

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

5. Null

null means an empty value intentionally assigned.

Example:

let currentBankBalance = null
console.log(typeof(currentBankBalance)) // object

You might expect the output to be null, but JavaScript prints object.

This is a known historical bug in JavaScript.

Example use case:

let coupon = null
console.log(coupon)

coupon = "save10"
console.log(coupon)

Initially the value is empty, later it can be updated.

6. Symbol

Symbol is a unique and immutable primitive value.

Example:

let n = Symbol("yes")

console.log(typeof(n)) // symbol

Symbols are rarely used in beginner-level code but are important to know.

Non-Primitive Data Types

Non-primitive data types are derived from primitive data types.

The main ones are:

• Arrays

• Functions

• Objects

These are more complex data structures.

1.Array

An array is a sequence of values stored together.

Each value has an index, and indexing starts from 0.

Example:

let arr = [1,2,3,4]

console.log(arr)
console.log(arr[2]) // 3

Arrays are mutable, meaning values can be changed.

Example:

let arr = [1,2,3,4]

arr[4] = 5
console.log(arr)

arr[1] = 8
console.log(arr)

Arrays in JavaScript can store different data types together.

Example:

let arr = ["srujan", "6969", null]

console.log(arr)

2.Functions

Functions are reusable blocks of code.

Instead of repeating the same logic many times, we can use a function.

Functions help reduce code repetition and save memory.

Example:

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

console.log(add(9,6))
console.log(add(2,8))
console.log(add(1,1))

3.Objects

Objects store data in key–value pairs.

Example:

let aboutMe = {
    name: "srujan",
    job: "founder",
    age: "21"
}

console.log(aboutMe)
console.log(typeof aboutMe)

Objects can contain multiple data types together.

Example-2

let course = {
    timings: ["monday","wed","friday"],
    paid: true,
    price: 4999,
    negativeReviews: null,

    teacher:{
        teacher: ["piyush sir","hitesh sir"," Newton sir"],
        salaries: 99_000_000_000_000_000_000n
    },

    managedBy(name){
        return `${name} sir manages the course and looks after other things`
    },
}

console.log(typeof course)
console.log(course.price)
console.log(course.managedBy("Newton"))

Objects can also contain nested objects and functions.

Interesting Fact

JavaScript’s entire type system was designed in just 10 days in 1995.

Because of this fast development, the language still carries some historical quirks.

One famous example is:

typeof null === "object"

This behavior has existed since the early days of JavaScript and remains unchanged.

THE END