JavaScript లో Objects (మరియు JSON బేసిక్స్)

నిజ జీవితంలోని వస్తువులకు రెండు విషయాలు ఉంటాయి:

• లక్షణాలు (Properties / Attributes): ఆ వస్తువు గురించిన వివరాలు. ఉదాహరణకు కారుకు బ్రాండ్ (Tata), రంగు (Red), ధర (12 లక్షలు).
• చేసే పనులు (Actions / Methods): ఆ వస్తువు చేసే క్రియలు. ఉదాహరణకు కారును స్టార్ట్ చేయడం (start()), డ్రైవ్ చేయడం (drive()), బ్రేక్ వేయడం (brake()).

JavaScript లో object ని తయారు చేయడానికి అత్యంత సులభమైన, ఆధునిక పద్ధతి Object Literal: కర్లీ బ్రాకెట్లు { } లోపల key: value రూపంలో రాస్తాం.

const student = {
  name: "రాహుల్",
  age: 20,
  branch: "CSE",
  isEnrolled: true,
  skills: ["HTML", "CSS", "JavaScript"]
};

console.log(student);
console.log(typeof student);

• name, age, branch లను Keys (లేదా Properties) అంటారు. ఇవి ఎల్లప్పుడూ స్ట్రింగ్స్ గా ఉంటాయి.
• వాటి ఎదురుగా ఉన్న "రాహుల్", 20, true, arrays లను Values అంటారు.
• ఒక object లో numbers, strings, booleans, arrays, మరియు ఇతర objects ని కూడా విలువలుగా ఉంచవచ్చు.
• const empty = {}; అని రాస్తే ఖాళీ object తయారవుతుంది.

Object లోపలి విలువలను చదవడానికి రెండు మార్గాలు ఉన్నాయి:

1. Dot Notation (డాట్ పద్ధతి): object.key — ఇది రాయడానికి చిన్నగా, చదవడానికి సులభంగా ఉంటుంది. 90% సమయాల్లో ఇదే వాడతాం.
2. Bracket Notation (బ్రాకెట్ పద్ధతి): object["key"] — చతురస్ర బ్రాకెట్లు మరియు కొటేషన్లు వాడతాం.

const person = {
  name: "సురేష్",
  age: 25,
  "home town": "విజయవాడ"
};

// 1. Dot Notation
console.log(person.name);

// 2. Bracket Notation
console.log(person["age"]);
console.log(person["home town"]);

// 3. Variable ద్వారా Access చేయడం
const key = "name";
console.log(person[key]);  // variable లోని "name" ని వెతుకుతుంది
console.log(person.key);   // ❌ undefined! "key" అనే పేరుతో ప్రాపర్టీ లేదు

// 4. లేని ప్రాపర్టీని అడిగితే:
console.log(person.salary); // undefined (error రాదు)

Object ని తయారుచేసిన తర్వాత కూడా కొత్త ఫీచర్లను చేర్చవచ్చు, ఉన్నవాటిని మార్చవచ్చు లేదా పూర్తిగా తీసివేయవచ్చు:

const car = {
  brand: "Tata",
  model: "Nexon",
  price: 1200000
};

// 1. కొత్త ప్రాపర్టీని చేర్చడం (Add)
car.color = "Red";

// 2. ఉన్న ప్రాపర్టీ విలువను మార్చడం (Update)
car.price = 1250000;

// 3. ప్రాపర్టీని పూర్తిగా తొలగించడం (Delete)
delete car.model;

console.log(car);

const Object ని మార్చవచ్చా? (Object Mutation vs Reassignment)

Arrays లాగానే, const తో డిక్లేర్ చేసిన Object లోని ప్రాపర్టీలను కూడా సులభంగా మార్చవచ్చు, చేర్చవచ్చు, డిలీట్ చేయవచ్చు. const అంటే ఆ వేరియబుల్ కి సరికొత్త Object అడ్రస్‌ని రీఅసైన్ చేయలేం అని మాత్రమే అర్థం:

const user = { name: "మనోజ్" };
user.name = "అజయ్"; // ✅ allowed (mutation)
console.log(user);

user = {}; // ❌ TypeError! Reassignment not allowed

ఒక Object లోని ప్రాపర్టీ విలువగా ఒక Function ని దాచితే, దాన్ని Method అంటారు. అంటే ఆ Object చేయగల ఒక పని అన్నమాట.

`this` అంటే ఏమిటి?

Method లోపల ఉన్నప్పుడు, this అనేది ప్రస్తుతం ఆ method ని పిలిచిన ఆబ్జెక్ట్‌ను సూచిస్తుంది. "నా పేరు (this.name)", "నా వయసు (this.age)" అని ఆబ్జెక్ట్ తన స్వంత వివరాలను తాను వాడుకోవడానికి this కీవర్డ్ తోడ్పడుతుంది.

const user = {
  firstName: "అనిల్",
  lastName: "కుమార్",
  age: 24,

  // Method రాసే ఆధునిక ES6 పద్ధతి:
  getFullName() {
    return `${this.firstName} ${this.lastName}`;
  },

  celebrateBirthday() {
    this.age += 1;
    return `హ్యాపీ బర్త్‌డే! ఇప్పుడు వయసు: ${this.age}`;
  }
};

console.log(user.getFullName());
console.log(user.celebrateBirthday());
console.log(user.age);

const bad = {
  name: "రవి",
  greet: () => `హలో, ${this.name}` // ❌ this.name is undefined!
};

Array కి for...of వాడినట్లుగా, Object లోని అన్ని కీలు మరియు విలువలను చదవడానికి for...in మరియు ఆధునిక Object క్లాస్ మెథడ్స్ వాడతాం:

const marks = {
  maths: 90,
  physics: 85,
  chemistry: 88
};

// 1. for...in లూప్ (ప్రతి కీ పై తిరుగుతుంది)
for (const subject in marks) {
  console.log(`${subject}: ${marks[subject]}`);
}

// 2. Object.keys() — అన్ని ప్రాపర్టీ పేర్ల Array ఇస్తుంది
console.log(Object.keys(marks));

// 3. Object.values() — అన్ని విలువల Array ఇస్తుంది
console.log(Object.values(marks));

// 4. Object.entries() — [key, value] జంటల 2D Array ఇస్తుంది
console.log(Object.entries(marks));

// 5. 'in' Operator — ప్రాపర్టీ ఉందో లేదో తనిఖీ చేస్తుంది
console.log("maths" in marks, "english" in marks);

ఒక Object లోపల మరొక Object ని ఉంచవచ్చు. దీన్ని Nested Object అంటారు (ఉదాహరణకు ఒక యూజర్ ఆబ్జెక్ట్ లో address మరొక ఆబ్జెక్ట్ కావచ్చు).

const user = {
  name: "ప్రియ",
  address: {
    city: "హైదరాబాద్",
    pincode: 500081
  }
};

// లోపలి ఆబ్జెక్ట్ విలువను యాక్సెస్ చేయడం:
console.log(user.address.city);

// లేని ప్రాపర్టీని సురక్షితంగా యాక్సెస్ చేయడం (Optional Chaining ?.)
console.log(user.contact?.phone);

ఒకవేళ మనం user.contact.phone అని ?. లేకుండా రాస్తే, user.contact అనేది undefined కాబట్టి జావాస్క్రిప్ట్ వెంటనే TypeError: Cannot read properties of undefined అని ప్రోగ్రామ్ ని క్రాష్ చేస్తుంది! కానీ user.contact?.phone అని రాస్తే (Optional Chaining), ఒకవేళ contact లేకపోతే అక్కడితో ఆగిపోయి సురక్షితంగా undefined ని ఇస్తుంది.

వెబ్ అప్లికేషన్లలో బ్రౌజర్ నుండి సర్వర్‌కి (లేదా సర్వర్ నుండి బ్రౌజర్‌కి) డేటాను పంపేటప్పుడు ఆబ్జెక్టులను డైరెక్ట్‌గా పంపలేం. వాటిని టెక్స్ట్ (String) రూపంలోకి మార్చాలి. ప్రపంచవ్యాప్తంగా సాఫ్ట్‌వేర్ రంగంలో డేటా మార్పిడి కోసం వాడే అత్యంత ప్రసిద్ధ టెక్స్ట్ ఫార్మాట్ JSON.

రెండు ముఖ్యమైన JSON మెథడ్స్:

• JSON.stringify(object): JS Object ని JSON టెక్స్ట్ స్ట్రింగ్ గా మారుస్తుంది (సర్వర్‌కి పంపేటప్పుడు వాడతాం).
• JSON.parse(string): JSON టెక్స్ట్ స్ట్రింగ్ ని తిరిగి ఉపయోగపడే నిజమైన JS Object గా మారుస్తుంది (సర్వర్ నుండి డేటా వచ్చినప్పుడు వాడతాం).

const employee = {
  id: 101,
  name: "కిరణ్",
  active: true
};

// 1. Object -> JSON String
const jsonString = JSON.stringify(employee);
console.log(jsonString);
console.log(typeof jsonString);

// 2. JSON String -> JS Object
const parsedObj = JSON.parse(jsonString);
console.log(parsedObj.name);
console.log(typeof parsedObj);

ఈ క్రింది 8 ప్రాక్టీస్ ప్రశ్నలకు ముందుగా మీ సొంతంగా కోడ్ రాయడానికి ప్రయత్నించండి. ఆ తర్వాత సమాధానాలను పరిశీలించండి:

1. ఒక పుస్తకం యొక్క శీర్షిక (title), రచయిత (author), ధర (price) వివరాలతో book object ని తయారు చేయండి.
2. పై book object లోకి కొత్తగా pages: 350 ని చేర్చి, price ని 10% తగ్గించండి.
3. student = { name: "రమ్య", marks: [80, 90, 70] } లోపల మార్కుల సగటును రిటర్న్ చేసే getAverage() method ని రాయండి.
4. ఒక object లోని అన్ని ప్రాపర్టీల విలువలను for...in లూప్ ద్వారా ప్రింట్ చేయండి.
5. { a: 10, b: 20, c: 30 } object లోని అన్ని సంఖ్యల మొత్తం ఎంత? (Object.values() మరియు reduce వాడండి).
6. user object లో email ఉందో లేదో in ఆపరేటర్ తో తనిఖీ చేయండి.
7. ఒక JS ఆబ్జెక్ట్ ని JSON string గా మార్చి, తిరిగి దాన్ని Object గా మార్చే కోడ్ రాయండి.
8. const original = { x: 5, y: 10 }; ని మార్చకుండా ఉండేలా ఒక స్వతంత్ర కాపీని (shallow copy) తయారు చేయండి.

const book = {
  title: "JavaScript మార్గదర్శి",
  author: "ఆనంద్",
  price: 500
};
book.pages = 350;
book.price = book.price - (book.price * 10 / 100);
console.log(book);
// Output: { title: 'JavaScript మార్గదర్శి', author: 'ఆనంద్', price: 450, pages: 350 }

const student = {
  name: "రమ్య",
  marks: [80, 90, 70],
  getAverage() {
    const sum = this.marks.reduce((t, m) => t + m, 0);
    return sum / this.marks.length;
  }
};
console.log(student.getAverage());
// Output: 80

const product = { name: "Laptop", brand: "Dell", ram: "16GB" };
for (const key in product) {
  console.log(`${key} -> ${product[key]}`);
}

const nums = { a: 10, b: 20, c: 30 };
const total = Object.values(nums).reduce((sum, n) => sum + n, 0);
console.log(total);
// Output: 60

const user = { name: "లక్ష్మి", age: 22 };
console.log("email" in user);
// Output: false

const profile = { user: "sita", status: "online" };
const str = JSON.stringify(profile);
console.log(str);
const obj = JSON.parse(str);
console.log(obj.user);
// Output: {"user":"sita","status":"online"} \n sita

const original = { x: 5, y: 10 };
const copy = { ...original };
copy.x = 999;
console.log(original.x, copy.x);
// Output: 5 999 (original సురక్షితంగా 5 గానే ఉంది!)