📘 Lesson · Lesson 29

Objects

What Objects Are

// An array holds an ordered LIST:
let marks = [85, 92, 78];

// An object holds NAMED properties — perfect for describing one thing:
let student = {
    name: "Aman",
    rollNo: 12,
    marks: 85,
    passed: true
};

An object stores data as key–value pairs, letting you describe a single real-world thing with named properties. Where an array says "here are three marks," an object says "here is a student, whose name is Aman and roll number is 12." Written with curly braces { }, each property has a key (the name) and a value, separated by a colon, with commas between pairs. Objects are how you model real data — a student, a product, a user, a settings configuration. Together, arrays and objects represent virtually all data in JavaScript.

Dot and Bracket Notation

let student = { name: "Aman", rollNo: 12 };

// Dot notation — clean and preferred:
console.log(student.name);        // "Aman"

// Bracket notation — needed when the key is in a variable:
console.log(student["name"]);     // "Aman"

let key = "rollNo";
console.log(student[key]);        // 12   ✓ dot notation can't do this
console.log(student.key);         // undefined ✗ looks for a key named "key"

There are two ways to read a property, and knowing when to use each matters. Dot notation (student.name) is cleaner and what you'll use most of the time. Bracket notation (student["name"]) takes the key as a STRING, which unlocks something dot notation cannot do: using a variable as the key. If the property name is stored in a variable, or is decided at runtime, or contains spaces/hyphens, you MUST use brackets. Remember the rule: dot for known names, brackets for dynamic keys.

Adding, Changing, and Deleting Properties

let student = { name: "Aman" };

student.rollNo = 12;              // ADD a new property
student.name = "Priya";           // CHANGE an existing one
delete student.rollNo;            // DELETE a property

console.log(student.city);        // undefined — missing keys give undefined
console.log("name" in student);   // true  — check if a key exists

Objects are flexible: you can add properties after creating them simply by assigning to a new key, change values by assigning to an existing key, and remove properties with the delete keyword. Reading a key that doesn't exist returns undefined (no error), so use the in operator to check existence properly. And just like arrays, an object declared with const can still have its properties modified — const only stops you reassigning the variable itself.

Nested Objects and Arrays

let student = {
    name: "Aman",
    address: {
        city: "Aligarh",
        state: "UP"
    },
    marks: [85, 92, 78]
};

console.log(student.address.city);   // "Aligarh"  — chain the dots
console.log(student.marks[0]);       // 85
console.log(student.marks.length);   // 3

// Optional chaining avoids errors on missing paths:
console.log(student.parent?.name);   // undefined instead of an error

Objects can contain other objects and arrays, nested as deeply as you need — this is how real data is structured. Reach into them by chaining: student.address.city. Real APIs return exactly this shape. One danger: if student.parent doesn't exist, then student.parent.name throws an error (you can't read a property of undefined) — a very common crash. The modern fix is optional chaining ?., which safely returns undefined instead of crashing. Use it whenever a nested path might be missing.

Methods and the this Keyword

let student = {
    name: "Aman",
    marks: 85,

    // A METHOD is just a function stored as a property:
    greet: function() {
        return "Hello, " + this.name;      // "this" = the object itself
    },
    // Modern shorthand:
    isPassed() {
        return this.marks >= 33;
    }
};

console.log(student.greet());      // "Hello, Aman"
console.log(student.isPassed());   // true

When a function is stored inside an object, it's called a METHOD. Inside a method, the keyword this refers to the object that owns it — so this.name means "this object's name property." That's how a method reads its own object's data. You've already used methods constantly: arr.push(), str.trim() — those are methods on arrays and strings. Note: don't use an arrow function as an object method, because arrows have no this of their own (remember the arrow functions chapter) and this.name would fail.

Exam Corner

Q: What is an object? A collection of key–value pairs describing one thing.

Q: When must you use bracket notation? When the key is in a variable, decided at runtime, or contains spaces/hyphens.

Q: How do you remove a property? With delete obj.key.

Q: What does this refer to inside an object method? The object that owns the method.

Q: What does optional chaining (?.) do? Safely returns undefined instead of throwing an error if part of the path is missing.

Objects क्या हैं

// Array kramik LIST rakhta hai:
let marks = [85, 92, 78];

// Object NAMED properties rakhta hai — ek cheez varnan karne ko perfect:
let student = {
    name: "Aman",
    rollNo: 12,
    marks: 85,
    passed: true
};

Object data को key–value जोड़ों के रूप में रखता है, आपको एक असली-दुनिया की चीज़ को named properties से वर्णन करने देते. जहां array कहता है "यहां तीन marks हैं," object कहता है "यहां एक student है, जिसका नाम Aman और roll number 12 है." Curly braces { } से लिखा, हर property की एक key (नाम) और value होती है, colon से अलग, जोड़ों के बीच commas. Objects से आप असली data model करते हैं — student, product, user, settings configuration. साथ में, arrays और objects JavaScript में लगभग सारा data दर्शाते हैं.

Dot और Bracket Notation

let student = { name: "Aman", rollNo: 12 };

// Dot notation — saaf aur pasandeeda:
console.log(student.name);        // "Aman"

// Bracket notation — jab key variable me ho tab zaruri:
console.log(student["name"]);     // "Aman"

let key = "rollNo";
console.log(student[key]);        // 12   ✓ dot notation yeh nahi kar sakta
console.log(student.key);         // undefined ✗ "key" naam ki key dhoondhta

Property पढ़ने के दो तरीके हैं, और कब कौन-सा use करें यह जानना मायने रखता है. Dot notation (student.name) साफ है और ज़्यादातर समय आप यही use करेंगे. Bracket notation (student["name"]) key को STRING के रूप में लेता है, जो वह खोलता है जो dot notation नहीं कर सकता: key के रूप में variable use करना. अगर property नाम variable में रखा है, या runtime पर तय होता है, या उसमें spaces/hyphens हैं, आपको brackets ZARURI हैं. Rule याद रखिए: ज्ञात नामों के लिए dot, dynamic keys के लिए brackets.

Properties जोड़ना, बदलना, और हटाना

let student = { name: "Aman" };

student.rollNo = 12;              // nayi property JODO
student.name = "Priya";           // maujooda BADLO
delete student.rollNo;            // property HATAO

console.log(student.city);        // undefined — gayab keys undefined deti hain
console.log("name" in student);   // true  — key maujood hai jaancho

Objects लचीले हैं: आप बनाने के बाद नई key पर assign करके properties जोड़ सकते हैं, मौजूदा key पर assign करके values बदल सकते हैं, और delete keyword से properties हटा सकते हैं. न मौजूद key पढ़ना undefined लौटाता है (कोई error नहीं), तो अस्तित्व ठीक से जांचने को in operator use कीजिए. और arrays की तरह, const से declare किए object की properties फिर भी बदली जा सकती हैं — const सिर्फ variable को reassign करने से रोकता है.

Nested Objects और Arrays

let student = {
    name: "Aman",
    address: {
        city: "Aligarh",
        state: "UP"
    },
    marks: [85, 92, 78]
};

console.log(student.address.city);   // "Aligarh"  — dots chain karo
console.log(student.marks[0]);       // 85
console.log(student.marks.length);   // 3

// Optional chaining gayab paths par errors se bachata hai:
console.log(student.parent?.name);   // error ke bajaye undefined

Objects दूसरे objects और arrays रख सकते हैं, जितना गहरा चाहिए nested — असली data ऐसे ही structured होता है. Chain करके उन तक पहुंचिए: student.address.city. असली APIs ठीक यही आकार लौटाते हैं. एक खतरा: अगर student.parent मौजूद न हो, तो student.parent.name error फेंकता है (आप undefined की property नहीं पढ़ सकते) — बहुत common crash. आधुनिक हल optional chaining ?. है, जो crash के बजाय सुरक्षित रूप से undefined लौटाता है. जब भी nested path गायब हो सकता हो इसे use कीजिए.

Methods और this Keyword

let student = {
    name: "Aman",
    marks: 85,

    // METHOD bas property ke roop me rakha function hai:
    greet: function() {
        return "Hello, " + this.name;      // "this" = object khud
    },
    // Modern shorthand:
    isPassed() {
        return this.marks >= 33;
    }
};

console.log(student.greet());      // "Hello, Aman"
console.log(student.isPassed());   // true

जब function object के अंदर रखा हो, उसे METHOD कहते हैं. Method के अंदर, keyword this उस object को refer करता है जिसका वह है — तो this.name मतलब "इस object की name property." ऐसे ही method अपने object का data पढ़ता है. आप methods पहले से लगातार use कर चुके: arr.push(), str.trim() — वे arrays और strings पर methods हैं. ध्यान: arrow function को object method मत बनाइए, क्योंकि arrows का अपना this नहीं होता (arrow functions chapter याद है) और this.name fail होगा.

Exam Corner

Q: Object क्या है? Key–value जोड़ों का संग्रह जो एक चीज़ का वर्णन करता है.

Q: Bracket notation कब ज़रूरी है? जब key variable में हो, runtime पर तय हो, या उसमें spaces/hyphens हों.

Q: Property कैसे हटाते हैं? delete obj.key से.

Q: Object method के अंदर this किसे refer करता है? उस object को जिसका वह method है.

Q: Optional chaining (?.) क्या करता है? Path का हिस्सा गायब हो तो error फेंकने के बजाय सुरक्षित रूप से undefined लौटाता है.

← Back to JavaScript Tutorial

💻 Live Code Editor

इस पेज का code यहाँ तैयार है — बदलिए और तुरंत नतीजा देखिए. कुछ install किए बिना.

👁 Live Preview

सब कुछ आपके browser में ही चलता है — कोई server, कोई signup नहीं. JavaScript का console.log देखने के लिए F12 दबाइए.