Theory
एक Event कभी Point नहीं था
पिछले lesson ने single event record perfect किया। पर FestConnect की reality plural है: 40 events की एक LIST, ticket prices की एक list, booked-or-free की rows और columns वाला एक hall का seat map।
XML elements repeat करके lists को fake करता था। JSON के पास असली चीज़ है: array, square brackets में ordered values, और आपका syllabus इसके 5 shapes को नाम देता है। सारे 5 एक grammar obey करते हैं; सिर्फ़ brackets के अंदर क्या बैठता है वह बदलता है।
Theory
Array, Formally
एक JSON array square brackets में values की एक ordered, comma-separated list है:
["Garba Night", "Coding Contest", "Robo Race"]
Properties जो matter करती हैं:
- ordered: position ही meaning है; parsing के बाद, 0 से index कीजिए
- values कोई भी JSON type हो सकती हैं: strings, numbers, booleans, null, objects, arrays
.lengthparsing के बाद elements गिनता है- एक array में types mix करना legal है, हालाँकि real data हर array को consistent रखता है
At a glance
5 Syllabus Forms, हर एक के लिए एक Fest
| Form | Example | FestConnect Meaning |
|---|---|---|
| Array of Strings | ["Garba Night", "Robo Race"] | Event names |
| Array of Numbers | [50, 100, 150] | Ticket price tiers |
| Array of Booleans | [true, true, false] | कौन से fest days खुले हैं |
| Array of Objects | [{"name": "Garba Night", "seats": 350}, ...] | खुद events की list |
| Multi-Dimensional | [[1, 1, 0], [0, 1, 1]] | Seat map: seats की rows |
Practical
सारे 5 Forms, Parsed और Walked (इसे Run कीजिए)
const text = `{
"names": ["Garba Night", "Coding Contest", "Robo Race"],
"prices": [50, 100, 150],
"daysOpen": [true, true, false],
"events": [
{ "name": "Garba Night", "seats": 350 },
{ "name": "Coding Contest", "seats": 60 }
],
"seatMap": [[1, 1, 0],
[0, 1, 1]]
}`;
const d = JSON.parse(text);
console.log(d.names[0]); // Garba Night (index from 0)
console.log(d.prices.length); // 3
console.log(d.events[1].name); // Coding Contest: index, then key
console.log(d.seatMap[1][2]); // 1: row index 1, seat index 2
for (const ev of d.events) { // the loop every fest page runs
console.log(ev.name + ": " + ev.seats + " seats");
}
This example runs in Gri-Learn on the web, where you can edit it and see the output.
Theory
एक Chained Access पढ़ना
2 compound forms slow motion deserve करते हैं।
Array of Objects: d.events[1].name एक path की तरह right to left पढ़ता है: d में, events लीजिए (एक array), index 1 पर element लीजिए (SECOND object), इसका name लीजिए। पहले index, फिर key।
Multi-Dimensional: d.seatMap[1][2] पहले outer index फिर inner है: index 1 पर row (दूसरी row [0, 1, 1]), फिर इसका index 2 पर element: value 1, एक booked seat। Row, फिर column, दोनों 0 से: BCA102 की matrix positions जैसी same discipline।
Quiz
Listing के data का इस्तेमाल करते हुए: d.events[0].seats किस value में evaluate होता है?
- 350: पहले event object की seats value
- 60: arrays 1 से index होते हैं, तो events[0] exist नहीं करता
- String "seats" खुद
- undefined: arrays के अंदर objects को एक special accessor चाहिए
Show the answer
350: पहले event object की seats value
Index 0 FIRST element है (Garba Night का object), और .seats इसका number pluck करता है: 350। Option B 1-based counting import करता है; JSON arrays, हर JavaScript array की तरह, 0 से शुरू होते हैं, तो events[1] Coding Contest है। Option C key के नाम को इसकी value से confuse करता है। Option D ऐसी ceremony invent करता है जो exist नहीं करती: एक array element जो एक object है ordinary dot access का answer देता है, यही exactly वजह है array-of-objects form real APIs में dominate करता है: list में index कीजिए, फिर इसे किसी भी object की तरह इस्तेमाल कीजिए।
Think first
Seat Row 0, Seat 2 Book कीजिए
एक student listing के seatMap में FIRST row की THIRD seat book करता है। Tap करने से पहले: कौन सा expression उस seat की current value पढ़ता है, अभी यह क्या है, और booking इसे किसमें बदलती है?
Show the answer
पहली row = index 0, तीसरी seat = index 2: d.seatMap[0][2], currently 0 (free, क्योंकि row 0 [1, 1, 0] है)। Booking d.seatMap[0][2] = 1 set करती है, row 0 को पूरी तरह booked बनाते हुए: [1, 1, 1]। Internalise करने लायक habit: brackets touch करने से PEHLE human counting (first, third) को indexes (0, 2) में translate कीजिए, outer dimension पहले। यहाँ off-by-one एक असली person के लिए ग़लत seat book करता है, जो कि यह exam point से refund queue बनने का तरीका है।
Watch out
Array Slips
Human Counting: events[1] SECOND event है: eternal off-by-one।
Trailing Comma: [50, 100, 150,] JSON.parse को fail करता है, objects जैसा same law।
Order Sब कुछ Survive करता है यह Assume करना: JSON arrays ordered हैं, पर object KEYS को कोई order promise नहीं है: array positions पर rely कीजिए, key positions पर कभी नहीं।
2-Row Map पर seatMap[2][0]: row index 2 exist नहीं करता; इसे पढ़ना undefined देता है और उस undefined के अंदर index करना throw करता है: rows वary करें तो .length check कीजिए।
Theory
अब आप कोई भी API Response पढ़ सकते हैं
Nested arrays वाले objects के arrays real-world API data की shape IS है: एक weather feed, एक cricket scorecard, आपके अपने future endpoints। Practice: कल का canteen menu JSON की तरह sketch कीजिए (days array, हर day एक object, हर meal एक string array) और chained access से इसे walk कीजिए। एक JSON topic बाकी है, और यह एक curiosity है: वह comment syntax जो JSON deliberately नहीं रखता, और इसके बजाय teams क्या करती हैं।
Summary
Key takeaways
- Arrays: [ ] में ordered, comma-separated values; parsing के बाद 0 से indexed; .length गिनता है।
- पाँच forms: strings, numbers, booleans, objects, और arrays-in-arrays (multi-dimensional)।
- Array of objects real-world king है: d.events[1].name पहले index, फिर key chain करता है।
- Multi-dimensional access outer-then-inner है: seatMap[row][seat], दोनों 0 से।
- Element types legally mix हो सकती हैं; consistent arrays sane arrays हैं।
- Array order guaranteed है; object key order नहीं है।
- Memory hook: brackets queue hold करते हैं, queue को 0 से गिनिए।