βπ» 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)