DEV Community

Cover image for 👇Primitive and Non-Primitive Data Types
Himanay Khajuria
Himanay Khajuria

Posted on

👇Primitive and Non-Primitive Data Types

✍🏻 Primitive and Non-Primitive Data Types in JavaScript

Hello everyone 👋

I’m Himanay Khajuria, a Frontend Developer at SITA.dev, and today I’m going to share something really helpful for anyone who is new to JavaScript ➵ understanding Primitive and Non-Primitive Data Types.

Whether you're just starting out or trying to revise your basics, this blog will help you understand these two important concepts in a very simple way with real-life examples. Let's get started! 🏁


✅ What are Data Types?

Before we dive into primitive and non-primitive, let's understand what a data type is.

👉 In simple words, data types tell JavaScript what kind of value a variable is holding.

Just like we know whether something is a number (like 5) or a word (like “hello”), JavaScript also needs to know what type of data you’re using so it can treat it correctly.


🟢 Primitive Data Types

Primitive means "basic" or "simple". These are the simple and fixed data types in JavaScript.

📋 List of Primitive Data Types:

Data Type Example Description
String "Hello" Text or words
Number 42 Numbers (whole or decimal)
Boolean true / false Yes or No, True or False
Undefined undefined Value is not assigned yet
Null null Intentionally empty
Symbol Symbol("id") Unique identifier (advanced usage)
BigInt 12345678901234567890n Very large numbers

🔍 Real-Life Examples

📌 Let’s understand with small relatable examples:

let name = "Himanay"; // String - like your name let age = 25; // Number - your age let isStudent = true; // Boolean - Yes or No question let job; // Undefined - not assigned yet let emptyValue = null; // Null - we know it's empty let uniqueKey = Symbol("id"); // Symbol - unique key let bigNumber = 12345678901234567890n; // BigInt - huge number 
Enter fullscreen mode Exit fullscreen mode

These values are stored directly in memory, and they are immutable, meaning they cannot be changed.


🔵 Non-Primitive Data Types

Now let’s look at Non-Primitive data types. These are more complex and can store multiple values.

📋 List of Non-Primitive Data Types:

Data Type Example Description
Object { name: "Himanay", age: 25 } Key-value pairs
Array [1, 2, 3] List of values
Function function() { console.log("Hi")} Block of reusable code

🔍 Real-Life Examples

📌 Think of these like boxes with many compartments:

let person = { name: "Himanay", age: 25 }; // Object - like your ID card with many details let fruits = ["Apple", "Banana", "Mango"]; // Array - list of fruits function greet() { console.log("Hello there!"); } // Function - like a machine that runs when called 
Enter fullscreen mode Exit fullscreen mode

These are stored by reference in memory, and they are mutable, so you can change the values.


🔄 Key Differences at a Glance

Feature Primitive Non-Primitive
Stored by Value Reference
Can be changed? ❌ No (Immutable) ✅ Yes (Mutable)
Type of data Simple Complex
Examples String, Number, Boolean Object, Array, Function

🧪 Quick Checklist for Revision

  • [x] Data types tell JavaScript what kind of data we are using
  • [x] Primitive types are basic and fixed
  • [x] Non-Primitive types are complex and can hold multiple values
  • [x] Primitive is stored by value, Non-Primitive by reference
  • [x] We can change Non-Primitive values, but not Primitive ones

🧠 Pro Tip

👉 Use typeof in JavaScript to check the type of value:

console.log(typeof "Himanay"); // Output: string console.log(typeof 10); // Output: number console.log(typeof {}); // Output: object 
Enter fullscreen mode Exit fullscreen mode

🔴 Final Thoughts

Understanding data types is like learning the alphabet before writing sentences. Once you know what kind of data you are working with, everything becomes easier ╰┈➤ from storing values to debugging issues.

🤗 I hope this blog helped you understand Primitive and Non-Primitive Data Types in a beginner-friendly way. Keep practicing and you'll get better every day!

Feel free to connect with me or share your feedback! 🙌

Happy coding! 👨‍💻✨

Top comments (0)