✍🏻 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
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
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
🔴 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)