Data Types in JavaScript

So far, we’ve learned what variables are and how to name them. You might have noticed that some variables are assigned values inside double or single quotes, like let name = "john", while others are just numbers without any quotes, like let x = 10. Some are simply true or false, like let isStudent = true.

In this section, we will learn about why some variables are assigned values in certain ways while others in a different way.

Real World Conversations

In our everyday life, when we talk to other people, we use a language like English. If you think about it, we don’t use only words to express ourselves but also numbers and symbols, right?

what is the time? // use of only words
he lives at 321 main st... // use of words and numbers
subscription is $9.99 // use of a symbol and number

Why can’t we use only letters for all our conversations? Well, that would make things really hard! Numbers and symbols help make communication clearer and more meaningful.

In the same way, when we write programs, we can’t rely on just one kind of data. We need different types like text, numbers, true/false values, and more to build useful and effective programs. These different forms are called data types in programming.

Data Types In JavaScript

Before we discuss various data types in JavaScript, first let’s first look at two broad categories of types: Primitive and Non-Primitive data types.

• Primitive Data Types are those data types that are provided by the language itself.
• Non-Primitive Data Types are those data types that are NOT provided by the language itself and are defined by the user.

Here’s a table that shows various data types in bot categories and we will discuss about the Primitive types only in this section. Non-Primitive Data types will be discussed in later posts.

Primitive Data Types	Non-Primitive Data Types
string	object
number	array
boolean	function
null
undefined
symbol
bigint

String Data Types

When we talk with others we normally use words and sentences. In Programming, when we want to store words, sentences or any other text, then we use String data type.

let name = "John Doe";
let sentence = "Start the computer";
let todo = 'Complete the assignment by 9pm';
let language = 'JavaScript';

You can see various examples of String data types. Now if you observe, above examples then all the values (sentences) are either enclosed in double quotes (“”) or single quotes (‘’). Right?

With this information, we can conclude that any variable whose value is assigned with double or single quotes constitutes as a String.

In short, String is a data type used for storing text, and its value is always surrounded by quotes.

Number Data Type

In real life, we use numbers to represent age, price, quantity, and many other things. In programming, we use the number data type for such values.

let age = 25;
let price = 9.99;
let quantity = 100;
let temperature = -5;

In contrast to String, if you observe the above examples, Number doesn’t have any quotes surrounding them. In JavaScript, we write numbers without quotes.

In Short, A Number is used to represent numeric values, whether they are whole numbers, decimals, or negative numbers.

Boolean Data Types

In everyday scenarios, several times a day we ask for questions or answers in a single Yes/No manner right? (although let’s be honest, people rarely stop at just yes or no!).

Is it raining outside?
would you like to go for a coffee?
Is my car insurance due?
are you feeling well?

All the above questions, have a Yes/No answer if you think about it. Similarly in programming there are many scenarios, where we just want to know a simple Yes/No answer for further execution of programs. Hence for this case, we have Boolean data type.

let isRaining = true;
let hasLicense = false;
let isLoggedIn = true;

In above example, we can observe that we simple write true/false to denote yes/no respectively. These are Booleans.

In Short, A Boolean is a data type that can only have two values: true or false.

Clearing Confusion : String vs Boolean vs Numbers

Wait! Before you proceed, let’s clear up a common confusion about how we write String, Number, and Boolean data types.

We learned:

• Strings are written with quotes around the value.
• Numbers are written without quotes.
• Booleans are written as true or false without quotes.

Now look at these examples:

let isTall = "true";
let price = "3.99";

At first glance, you might think isTall is a Boolean and price is a Number. But actually No, Since both values are surrounded by quotes, they are Strings.

Remember: If the value is inside quotes, it is a String, no matter what the content looks like.

Null Data Type

Sometimes in real life, we have situations where something is just empty on purpose. Like when you fill out a form, and you leave a field blank because it doesn’t apply to you. You left that field empty because it wasn’t relevant to you and wrote NIL or N/A instead.

In programming, when we want to say that a variable has no value on purpose, we use null.

Take an example where we have a card-building website, and we have a color selection field for the background of the card. For that, we use a selectedColor variable.

let selectedColor = null;

In above example, we set selectedColor to null. Why? Because we don’t want to select the color by default, it’s the user who will select the color.

In short, null represents an empty or unknown value that has been deliberately assigned.

Undefined Data Type

Imagine you’re filling out a form, and there’s a field for “middle name.” You see the box, but you don’t type anything in yet. The box exists, it’s there but no value has been entered. You simply haven’t decided what to put in it (or maybe you won’t put anything at all).

In programming, when we create a variable but don’t give it any value yet, JavaScript automatically assigns it the value undefined.

It’s like saying: This exists, but I don’t know its value right now.

Let’s look at an example:

let middleName;

In the above example, middleName exists, but we didn’t assign any value to it. If you check its value, JavaScript will say it is undefined.

In short, undefined means a variable has been declared but hasn’t been given a value yet.

Clearing Confusion: null vs undefined

Wait! You might be wondering; both null and undefined are for empty values. Hmm! So, what’s the difference? Does it even matter if I use either of those interchangeably?

Well! Good Question!

So, to clear this confusion let’s take that empty form example again shall we?

• You saw a field on form, which wasn’t relevant to you, so you write NIL or N/A to it. This is what null is. you deliberately marked it as empty.
• You saw a field on form, which wasn’t relevant to you, but instead of writing anything you leave it blank. This is what undefined is. you didn’t fill it out at all.

So, based on that:

• We use null, we intentionally say that this variable has no value currently, but it might have one in the future.
• We use undefined when we simply haven’t assigned any value yet — the variable exists, but no one has decided what it should be.

Symbol Data Type

Imagine you’re organizing a huge event and you want to give every guest a unique badge number so you can easily identify them. No two guests should have the same badge number, even if they have the same name.

In programming, sometimes we need unique identifiers like these badges. That’s where the Symbol data type comes in. Each Symbol value is completely unique, even if it looks similar to another symbol.

let id1 = Symbol("id");
let id2 = Symbol("id");
console.log(id1 === id2); // false

In above example, even though both symbols have the description ‘id’, they are different and unique.

In short, Symbol is a special primitive data type used to create unique identifiers.

Fun Fact: You cannot output the value of a Symbol. It’s implemented in native C++ code of JS engine itself. Learn more Is it Possible to access the value of a symbol in JavaScript?

BigInt Data Type

Imagine you’re trying to count something enormous; like the number of atoms in the universe, or the distance light travels in a year in meters. These numbers are insanely huge, way beyond what regular numbers can handle safely.

Or think about the value of Pi (π). It’s a famous number with infinite decimal places, but when you work with extremely large whole numbers, normal JavaScript Number type just can’t keep up because it has limits.

That’s where BigInt comes in! It’s designed to handle really, really big integers, way bigger than the usual number limits.

let speedOfLightInMetersPerSecond = 299792458n;
let atomsInObservableUniverse = 1000000000000000000000000000000000000n;

In above example, the word n at the end implies to JavaScript, that it’s a BigInt.

In short, BigInt is your go-to data type when you need to handle numbers as big as the universe itself.

🧵 Wrapping It Up

So now you know why we use different data types like String, Number, Boolean, null, undefined, BigInt, and more, because not all data in a program is the same. Each type has its own purpose and helps us write code that’s clear, precise, and meaningful.

Choosing the right data type isn’t just about making your code work and it’s about making sure your program behaves the way you expect and communicates your intent clearly to anyone reading your code (including your future self!).

Next time you create a variable, don’t just think about the value but think about the type too.