Understanding Objects in JavaScript
Objects:-
Objects are non- primitive data type of javascript.
An object in JavaScript is a collection of key–value pairs (properties and methods).
Key → Always a string (or symbol)
Value → Can be any data type (primitive or another object)
Objects are used to group related data and functionality together.
Syntax:
const user = {
name: "Ritu",
age: 30,
skills: ["JavaScript", "React", "TypeScript"],
address: {
city: "Jaipur",
country: "India"
},
greet() {
return `Hello ${this.name}`;
}
}
Creating Objects
a) Object Literal
const car = { brand: "Tesla", model: "Model S" };
b) Using new Object()
const car = new Object();
car.brand = "Tesla";
car.model = "Model S";
c) Constructor Function
function Car(brand, model) {
this.brand = brand;
this.model = model;
}
const car1 = new Car("Tesla", "Model S");
d) ES6 Class
class Car {
constructor(brand, model) {
this.brand = brand;
this.model = model;
}
}
const car1 = new Car("Tesla", "Model S");
Accessing Object Properties
a) Dot Notation:-
console.log(car.brand); // Tesla
b) Bracket Notation:-
console.log(car["model"]); // Model S
5. Adding, Updating, and Deleting Properties
const user = { name: "ritu" };
// Add
user.age = 25;
// Update
user.name = "ritu sood";
// Delete
delete user.age;
console.log(user); // { name: "ritu sood" }
Methods in Objects:-
A method is simply a function stored as a property of an object.
const person = {
name: "ritu sood",
greet() {
console.logHello, I'm ${this.name});
}
};
person.greet(); // Hello, I'm ritu sood
Nested Objects:-
const user = {
name: "ritu sood",
address: {
city: "Jaipur",
zip: 10001
}
};
console.log(user.address.city); // Jaipur
Objects in Memory (Heap & Stack):- When you create an object:
The variable name is stored in the stack.
- The actual object data is stored in the heap.
STACK HEAP
---------------------------------------
user ───────► { name: "ritu", age: 25 }
Looping through Objects:-
const user = { name: "ritu sood", age: 25 };
for (let key in user) {
console.log(key, user[key]);
}
output:
// name ritu sood
// age 25
Some Built-in Object Methods
const obj = { a: 1, b: 2 };
console.log(Object.keys(obj));
// ['a', 'b']
console.log(Object.values(obj));
// [1, 2]
console.log(Object.entries(obj));
// [['a', 1], ['b', 2]]
Object.keys():
Returns all property names (keys) of an object as an array.
['a', 'b']
example:-
Object.keys(obj).forEach(key => {
console.log(key);
});
//output:-
//a
// b
Object.values():-
Object.values(obj)
example:-
const total = Object.values(obj).reduce((sum, val) => sum + val, 0);
console.log(total);
Note:- 1) Objects are reference types → assigning them to another variable copies the reference, not the actual object.
2) Modifying a copied reference affects the original object.
