JavaScript — Objects

Objects group related data

An object stores related values together using key-value pairs.

const user = {
    name: "Alice",
    age: 25,
    city: "Ahmedabad"
};

Think of an object as a labeled container:

user
├── name → "Alice"
├── age  → 25
└── city → "Ahmedabad"

Each key is called a property.

console.log(user.name);
console.log(user.age);

Output:

Alice
25

Dot notation

The most common way to access a property is dot notation.

const car = {
    brand: "Toyota",
    model: "Camry",
    year: 2025
};

console.log(car.brand);
console.log(car.model);

Dot notation is short and readable.

car.year
car.brand
car.model

Bracket notation

You can also access properties using brackets.

console.log(car["brand"]);
console.log(car["model"]);

The result is the same:

Toyota
Camry

Bracket notation becomes useful when the property name is stored in a variable.

const key = "brand";

console.log(car[key]);

Do not write this when you want a dynamic key:

car.key

That looks for a property literally named key.

Use:

car[key]

Adding properties

Objects can be changed after creation.

const user = {
    name: "Alice"
};

user.age = 25;
user.city = "Ahmedabad";

console.log(user);

Now the object contains:

name
age
city

Changing properties

Assign a new value to an existing property.

user.age = 26;

console.log(user.age);

Output:

26

Objects are generally mutable.

const person = {
    name: "Sam"
};

person.name = "Alex";

const prevents reassignment of the variable, not modification of the object.

Removing properties

Use delete.

const user = {
    name: "Alice",
    age: 25,
    city: "Ahmedabad"
};

delete user.city;

console.log(user);

The city property is gone.

console.log(user.city);

Output:

undefined

Objects can contain different types

Properties don't have to contain strings.

const product = {
    name: "Laptop",
    price: 75000,
    available: true,
    tags: ["computer", "electronics"]
};

An object can contain:

• strings
• numbers
• booleans
• arrays
• other objects
• functions
• null
• other JavaScript values

Nested objects

Objects can contain other objects.

const user = {
    name: "Alice",
    address: {
        city: "Ahmedabad",
        country: "India"
    }
};

Access nested values:

console.log(user.address.city);
console.log(user.address.country);

Output:

Ahmedabad
India

Objects inside arrays

Arrays can contain objects.

const users = [
    { name: "Alice", age: 25 },
    { name: "Bob", age: 30 },
    { name: "Charlie", age: 22 }
];

console.log(users[0].name);

Output:

Alice

This pattern is extremely common when working with APIs.

const todos = [
    { id: 1, title: "Learn JS", done: false },
    { id: 2, title: "Practice", done: true }
];

Arrays inside objects

The reverse is also possible.

const student = {
    name: "Alex",
    subjects: ["Math", "JavaScript", "CSS"]
};

console.log(student.subjects[0]);

Output:

Math

Checking whether a property exists

Use the in operator.

const user = {
    name: "Alice",
    age: 25
};

console.log("name" in user);
console.log("email" in user);

Output:

true
false

You can also use:

user.email !== undefined

But in specifically checks whether the property exists.

Object values can be expressions

Property values can come from variables.

const name = "Alice";
const age = 25;

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

Objects are references

This is an important concept.

const user1 = { name: "Alice" };
const user2 = user1;

user2.name = "Bob";

console.log(user1.name);   // Bob — same object!

user1 ──┐
        ├──> { name: "Bob" }
user2 ──┘

Copy with spread to stay independent:

const copy = { ...user1 };
copy.name = "Carol";
console.log(user1.name);   // "Bob" — original untouched now

Comparison is by reference, not contents:

{ name: "Alice" } === { name: "Alice" }   // false — two objects

Useful object methods

Object.keys(user);     // ["name", "age"]
Object.values(user);   // ["Alice", 25]
Object.entries(user);  // [["name","Alice"], ["age",25]]

Looping through an object

for (const key in user) {
    console.log(key, user[key]);
}

Or the entries pipeline:

for (const [key, value] of Object.entries(user)) {
    console.log(key, value);
}

Object destructuring

Extract properties into variables:

const { name, age } = user;

const { name: userName } = user;   // rename while extracting

Functions can destructure parameters directly:

function greet({ name }) {
    console.log(`Hello ${name}`);
}
greet({ name: "Alice" });

Objects and JSON

Objects become JSON for transport:

JSON.stringify(user);        // '{"name":"Alice","age":25}'
JSON.parse('{"a":1}');       // back to object

Mini Practice

1. Create a book object with title, author and year.
2. Add a price property after creating it; change the year; delete the price.
3. Build an array of three user objects; access the second user's name.
4. Create a nested address object and read its city.
5. Use Object.keys(), Object.values() and a for...in loop.
6. Convert an object to JSON and parse it back.