Learn Objects in JavaScript in Hindi – Easy Guide for Beginners

by

JavaScript में objects जटिल डेटा संरचनाएँ हैं, जो key-value pairs के रूप में डेटा को व्यवस्थित और प्रबंधित करते हैं। यह ब्लॉग HindiStudyHub के लिए Object Creation, Properties, Methods, Accessing (Dot/Bracket Notation), Nested Objects, और Destructuring (Basic) को सरल हिंदी में समझाता है।

साथ ही, exercise (कार ऑब्जेक्ट), 5 MCQ quiz, और mini project (छात्र रिकॉर्ड सिस्टम) आपके JavaScript स्किल्स को बढ़ाएंगे। टेक्निकल टर्म्स (जैसे object, property, method) English में हैं, और कोड पूरी तरह English में है।

What is Objects in JavaScript in Hindi? (JavaScript में ऑब्जेक्ट क्या होते है?)

Objects key-value pairs को स्टोर करने वाले reference types हैं, जो heap memory में रहते हैं। Properties और methods के ज़रिए डेटा को व्यवस्थित करते हैं। यह डेटा को वास्तविक दुनिया की चीज़ों (जैसे व्यक्ति, कार) की तरह मॉडल करने में मदद करते हैं। Objects को कॉपी करने पर reference कॉपी होता है, न कि डेटा।

Example:

const person = { name: "Amit", age: 25 };
console.log(person.name); // Amit

Object Creation:

Object Creation object literals ({}) या Object constructor से होता है। Literals सिंटैक्स सरल और तेज़ है, जबकि constructor ज्यादा लचीलापन देता है।

Example:

const car = { brand: "Toyota", model: "Corolla" };
const obj = new Object();
obj.name = "Test";
console.log(car.brand); // Toyota

Properties:

Properties keys (strings/symbols) और values (कोई भी प्रकार) का जोड़ा हैं। डायनामिक जोड़ना/हटाना सपोर्ट करते हैं। Property descriptors से read-only या hidden properties बनाए जा सकते हैं।

Example:

const student = { name: "Ravi", rollNo: 101 };
student.grade = "A";
console.log(student); // { name: "Ravi", rollNo: 101, grade: "A" }

Methods:

Methods object में स्टोर किए गए functions हैं, जो व्यवहार को परिभाषित करते हैं। this से properties को access करते हैं। Methods ऑब्जेक्ट के डेटा पर काम करके उसे प्रोसेस करते हैं।

Example:

const user = {
name: "Priya",
greet: function() { return Hello, ${this.name}!; }
};
console.log(user.greet()); // Hello, Priya!

Accessing:

Accessing properties को dot notation (.) या bracket notation ([]) से प्राप्त करता है। Dot notation तेज़ और पढ़ने में आसान है, जबकि bracket notation डायनामिक keys के लिए उपयोगी है।

Example:

const book = { title: "JavaScript Guide", year: 2023 };
console.log(book.title); // JavaScript Guide
console.log(book["year"]); // 2023

Dot Notation:

Dot notation DOM में element की प्रॉपर्टीज़ या मेथड्स को सीधे एक्सेस करता है। यह पढ़ने में आसान और तेज़ है।

Example:

const title = document.getElementById("title");
console.log(title.textContent); // Title text

Bracket Notation:

Bracket notation DOM में प्रॉपर्टीज़ को डायनामिकली एक्सेस करता है, खासकर जब नाम वेरिएबल में हो।

Example:

const prop = "textContent";
const title = document.getElementById("title");
console.log(title[prop]); // Title text

Nested Objects:

Nested Objects objects के अंदर objects को स्टोर करते हैं। यह hierarchical data जैसे पते या प्रोफाइल को व्यवस्थित करने में मदद करते हैं।

Example:

const person = { name: "Anil", address: { city: "Delhi", zip: 110001 } };
console.log(person.address.city); // Delhi

Destructuring (Basic):

Destructuring object properties को variables में निकालता है। Syntax sugar से कोड पढ़ना आसान होता है।

Example:

const user = { name: "Neha", age: 30 };
const { name, age } = user;
console.log(name, age); // Neha 30

Exercise: Create and update a car object

Task: Object बनाएँ जो कार (ब्रांड, मॉडल, वर्ष) को दर्शाए। Properties को अपडेट करें।

Code:

function createCar(brand, model, year) {
if (typeof brand !== "string" || typeof model !== "string" || !Number.isInteger(year)) {
return "Invalid input";
}
const car = { brand, model, year };
car.updateYear = function(newYear) {
if (!Number.isInteger(newYear)) return "Invalid year";
this.year = newYear;
return { ...this };
};
return car;
}
const myCar = createCar("Honda", "Civic", 2020);
console.log(myCar);
console.log(myCar.updateYear(2022));

Quiz: Object-Syntax

  1. What is the output of const obj = { name: "Amit" }; console.log(obj.name);?

    • A) Amit
    • B) undefined
    • C) Error
    • D) null
    • Answer: A) Amit

  2. What is the output of const obj = { key: "value" }; console.log(obj["key"]);?

    • A) undefined
    • B) value
    • C) Error
    • D) key
    • Answer: B) value

  3. What is the output of const obj = { name: "Ravi", greet: function() { return this.name;} }; console.log(obj.greet());?

    • A) Ravi
    • B) undefined
    • C) Error
    • D) greet
    • Answer: A) Ravi

Mini Project: Student Record System

Task: Object-based छात्र रिकॉर्ड सिस्टम बनाएँ, जो नाम और ग्रेड्स को स्टोर करे और औसत निकाले।

Code:

function createStudentRecord(name, grades) {
if (typeof name !== "string" || !Array.isArray(grades) || !grades.every(g => typeof g === "number")) {
return "Invalid input";
}
const student = {
name,
grades,
calculateAverage: function() {
if (this.grades.length === 0) return 0;
const sum = this.grades.reduce((acc, grade) => acc + grade, 0);
return sum / this.grades.length;
},
addGrade: function(grade) {
if (typeof grade !== "number") return "Invalid grade";
this.grades.push(grade);
return { ...this, grades: [...this.grades] };
}
};
return student;
}
const student = createStudentRecord("Anil", [85, 90, 95]);
console.log(student.calculateAverage()); // 90
console.log(student.addGrade(88));

Conclusion

Objects JavaScript में जटिल डेटा को प्रबंधित करने का शक्तिशाली तरीका हैं। Properties, Methods, और Destructuring से डेटा प्रोसेसिंग आसान होती है। HindiStudyHub पर प्रैक्टिस करें और अगले मॉड्यूल में Functions सीखें।

Also Read:

Leave a Comment