📘 Objects in JavaScript

1. What is an Object?

An object is a collection of key–value pairs. Keys are called properties, and values can be any data type (string, number, array, function, etc.).

2. Properties

Properties are variables attached to an object.

let person = {
  name: "Alice",
  age: 25,
  city: "Hyderabad"
};

console.log(person.name);   // Alice
console.log(person["age"]); // 25
  

3. Methods

A method is a function stored as a property of an object. Methods define the behavior of the object.

let person = {
  name: "Alice",
  age: 25,
  greet: function() {
    return "Hello, my name is " + this.name;
  }
};

console.log(person.greet()); // Hello, my name is Alice
  

4. The this Keyword

The this keyword refers to the object that is executing the current function. Inside a method, this refers to the object itself.

let car = {
  brand: "Toyota",
  model: "Corolla",
  start: function() {
    console.log(this.brand + " " + this.model + " is starting...");
  }
};

car.start(); // Toyota Corolla is starting...
  

5. Adding, Updating, Deleting Properties

let user = { name: "Bob" };

// Add
user.age = 30;

// Update
user.name = "Robert";

// Delete
delete user.age;

console.log(user); // { name: "Robert" }
  

6. Quick Recap

• Properties → key–value pairs (data).
• Methods → functions inside objects (behavior).
• this → refers to the object itself when used inside a method.

📌 Mini Project: Simple Calculator Object

let calculator = {
  add: function(a, b) {
    return a + b;
  },
  subtract: function(a, b) {
    return a - b;
  },
  multiply: function(a, b) {
    return a * b;
  },
  divide: function(a, b) {
    return b !== 0 ? a / b : "Cannot divide by zero";
  }
};

console.log(calculator.add(10, 5));      // 15
console.log(calculator.subtract(10, 5)); // 5
console.log(calculator.multiply(10, 5)); // 50
console.log(calculator.divide(10, 5));   // 2
  

📘 Object Destructuring and Spread/Rest Operators

1. Object Destructuring

Destructuring allows you to extract values from objects (or arrays) into variables in a clean, concise way.

// Example object
const user = { name: "Alice", age: 25, city: "Hyderabad" };

// Destructuring
const { name, age } = user;

console.log(name); // Alice
console.log(age);  // 25
  

Renaming Variables

const { name: userName, city: location } = user;
console.log(userName); // Alice
console.log(location); // Hyderabad
  

Default Values

const { country = "India" } = user;
console.log(country); // India (default used)
  

2. Array Destructuring

const colors = ["red", "green", "blue"];
const [first, second] = colors;

console.log(first);  // red
console.log(second); // green
  

3. Spread Operator (...)

The spread operator expands elements of an array or properties of an object.

// Arrays
const arr1 = [1, 2, 3];
const arr2 = [4, 5];
const combined = [...arr1, ...arr2];
console.log(combined); // [1, 2, 3, 4, 5]

// Objects
const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3 };
const merged = { ...obj1, ...obj2 };
console.log(merged); // { a:1, b:2, c:3 }
  

4. Rest Operator (...)

The rest operator collects remaining elements into an array or object.

// Arrays
const [x, y, ...rest] = [10, 20, 30, 40, 50];
console.log(x);    // 10
console.log(y);    // 20
console.log(rest); // [30, 40, 50]

// Objects
const { name: n, ...others } = user;
console.log(n);      // Alice
console.log(others); // { age: 25, city: "Hyderabad" }
  

5. Quick Recap

• Destructuring → Extract values from arrays/objects into variables.
• Spread (...) → Expands arrays/objects into individual elements.
• Rest (...) → Collects remaining elements into an array/object.

📌 Mini Project: Merge User Profiles

const basicInfo = { name: "Alice", age: 25 };
const contactInfo = { email: "alice@example.com", city: "Hyderabad" };

// Merge using spread
const userProfile = { ...basicInfo, ...contactInfo };

console.log(userProfile);
// { name: "Alice", age: 25, email: "alice@example.com", city: "Hyderabad" }

// Destructure
const { name, email, city } = userProfile;
console.log(name, email, city);
// Alice alice@example.com Hyderabad