Day nderstanding JavaScript Data Types: Primitive vs. Non-Primitive

In JavaScript, data types are divided into two main categories: Primitive and Non-Primitive (Reference) types. This distinction is essential for understanding how data is stored and accessed in memory. Let's break down each type and see how they work.

Primitive Data Types

JavaScript has 7 primitive data types:

1. String
   
   Represents textual data, e.g., "Hello World".

2. Number
   
   Represents both integer and floating-point numbers, e.g., 100, 100.3. Unlike some other languages, JavaScript doesn't distinguish between integers and floats—they're all just Number.
   

   const score = 100;
   const scoreValue = 100.3;
   console.log(typeof scoreValue); // Output: number
   

3. Boolean
   
   Represents logical values: true or false.
   

   const isLoggedIn = true;
   console.log(typeof isLoggedIn); // Output: boolean
   

4. Symbol
   
   Represents a unique identifier. Even if two symbols are created with the same description, they are distinct.
   

   const id = Symbol('123');
   const anotherId = Symbol('123');
   console.log(id === anotherId); // Output: false
   

5. Null
   
   Represents an intentional absence of any object value.
   

   const outsideTemp = null;
   console.log(typeof outsideTemp); // Output: object
   

6. Undefined
   
   Represents a variable that has been declared but not yet assigned a value.
   

   let weather;
   console.log(typeof weather); // Output: undefined
   

7. BigInt
   
   Represents integers with arbitrary precision, allowing you to work with large numbers beyond the safe integer limit of Number.
   

   const bigNumber = 23873847283748289483n;
   console.log(typeof bigNumber); // Output: bigint
   

Primitive Data Types: Call by Value

Primitive types are stored directly in the memory location associated with a variable. When you assign a primitive value to another variable, a new copy of the value is created.

let myName = "Aman";
let myOtherName = myName;
myOtherName = "Dawn";
console.log(myName);       // Output: Aman
console.log(myOtherName);  // Output: Dawn

In the example above, changing myOtherName does not affect myName, because a new copy of the value was created.

Non-Primitive Data Types

Non-primitive types, also known as reference types, include:

1. Arrays
   
   Collections of elements that can be of any type, stored as a list.
   

   const heros = ["ironman", "spiderman", "batman"];
   console.log(typeof heros); // Output: object
   

2. Objects
   
   Collections of key-value pairs, where the keys are strings or Symbols, and the values can be of any type.
   

   let myObj = {
       name: "Ayush",
       age: 21,
   };
   console.log(typeof myObj); // Output: object
   

3. Functions
   
   Blocks of code designed to perform a particular task, which can be stored in variables.
   

   const myFunction = function() {
       console.log("Hello World");
   };
   console.log(typeof myFunction); // Output: function
   

Non-Primitive Data Types: Call by Reference

Non-primitive types are stored in the heap, and the variable holds a reference (memory address) to the actual data. When you assign a non-primitive type to another variable, both variables point to the same memory location.

let userOne = {
    email: "user1@google.com",
    upi: "user@ybl"
};
let userTwo = userOne;
userTwo.email = "aman@google.com";
console.log(userOne.email);  // Output: aman@google.com
console.log(userTwo.email);  // Output: aman@google.com

In the example above, modifying userTwo.email also changes userOne.email because both variables reference the same object in memory.

Key Takeaways

• Primitive types are simple data types that store values directly. They are immutable, and each variable holds its own copy of the data.
• Non-primitive types are more complex, and variables store references to the data. Changes to one variable can affect others that reference the same data.
• Understanding these differences is crucial for writing efficient and bug-free code in JavaScript.

Happy coding and see you in the next one!!!

The above is the detailed content of Day nderstanding JavaScript Data Types: Primitive vs. Non-Primitive. For more information, please follow other related articles on the PHP Chinese website!