Theory
'3 महीने बाकी' ने ग़लत number कहा
FestConnect को एक countdown चाहिए: 'Fest N दिनों में शुरू होता है'। आप fest date को new Date(2026, 3, 12) के रूप में बनाते हैं जिसका मतलब है 12 March, इसे run करते हैं, और countdown एक महीना off है। April, March नहीं।
Date object time में एक moment hold करने वाला एक छोटा package है, इसके parts पढ़ने के लिए getters और उन्हें बदलने के लिए setters के साथ। यह genuinely useful है, पर इसके दो numbers एक ऐसे तरीक़े से गिने जाते हैं जो सबको surprise करता है।
Theory
एक clock जिसे आप part by part पढ़ सकते हैं
एक Date एक clock-calendar जैसा है जिसे आप एक बार में एक dial question कर सकते हैं: 'कौन सा year?', 'कौन सा month?', 'कौन सी date?', 'कौन सा hour?'। हर getter एक dial पढ़ता है। Catch यह है कि month dial 0 से printed है (January 0 mark है, 1 नहीं), एक floor numbering जैसा जो 'first' के बजाय 'ground' से शुरू होती है। Dial पढ़िए, फिर adjust कीजिए।
Theory
Create, get, set
- Create:
new Date()अभी है;new Date(2026, 2, 12)12 March 2026 है (month 2 = March, क्योंकि months 0-indexed हैं)। - Getters:
getFullYear(),getMonth()(0 से 11),getDate()(1 से 31, day of month),getDay()(0 से 6, day of week, 0 = Sunday),getHours()। - Setters:
setFullYear(),setMonth(),setDate(),setHours()। - toString(): एक readable text form।
कोई setDay नहीं है: weekday read-only है; calendar day बदलने के लिए setDate इस्तेमाल कीजिए।
Practical
FestConnect countdown
// month is 0-indexed: 2 means MARCH, not February
let festDay = new Date(2026, 2, 12); // 12 March 2026
console.log(festDay.getFullYear()); // 2026
console.log(festDay.getMonth()); // 2 (March! add 1 for humans)
console.log(festDay.getDate()); // 12 (day of month)
console.log(festDay.getDay()); // 4 (Thursday: 0=Sun..4=Thu)
let today = new Date();
let msPerDay = 1000 * 60 * 60 * 24;
let daysToGo = Math.ceil((festDay - today) / msPerDay);
console.log("Fest starts in " + daysToGo + " days");
// change a part with a setter
festDay.setDate(14); // move it to 14 MarchThis example runs in Gri-Learn on the web, where you can edit it and see the output.
Think first
getDate या getDay?
12 March 2026 (एक Thursday) के लिए, getDate() क्या return करता है और getDay() क्या return करता है? Students लगातार इन दोनों को swap करते हैं। tap करने से पहले दोनों बताइए।
Show the answer
getDate() 12 return करता है: month का day (1 से 31)। getDay() 4 return करता है: week का day, Sunday = 0 से गिनते हुए (तो Thu = 4)। वे सुनने में एक जैसे लगते हैं पर अलग मतलब रखते हैं: getDate calendar number है, getDay कौन सा weekday है। अगर आपको '12' चाहिए, यह getDate है; अगर आपको 'Thursday' चाहिए, यह एक नाम में mapped getDay है।
Quiz
आपको 12 March 2026 चाहिए। JavaScript months कैसे गिनता है यह देखते हुए, कौन सा constructor call सही है?
- new Date(2026, 2, 12), क्योंकि month 2 = March (0-indexed)
- new Date(2026, 3, 12), क्योंकि March 3rd month है
- new Date(12, 3, 2026), day पहले
- new Date(2026, 03, 12), months को दो digits का होना चाहिए
Show the answer
new Date(2026, 2, 12), क्योंकि month 2 = March (0-indexed)
Months 0-indexed हैं: January 0 है, तो March 2 है, new Date(2026, 2, 12) देते हुए (A)। 3 लिखना (B) April पर उतरता है, hook में exact off-by-one bug। Argument order year, month, day है, day-first नहीं (C)। और months plain numbers हैं, zero-padded नहीं (D)। Construct करते समय हमेशा human month से एक घटाइए, और getMonth() display करते समय एक जोड़िए।
Watch out
Date traps
1. Months 0-indexed हैं: getMonth() January के लिए 0 return करता है। Display करने को 1 जोड़िए, construct करने को 1 घटाइए। यह number-one Date bug है।
2. getDay getDate नहीं है: getDay = weekday (0 से 6), getDate = day of month (1 से 31)।
3. कोई setDay नहीं: weekday derived है, settable नहीं। Month के एक अलग day पर जाने के लिए setDate इस्तेमाल कीजिए; weekday ख़ुद update हो जाता है।
Theory
अब इसे page पर लाइए
अभी countdown सिर्फ़ console पर print होता है। अगले दो lessons में आप DOM सीखते हैं, और आप इस 'Fest N दिनों में शुरू होता है' को सीधे एक FestConnect banner element में डालेंगे ताकि visitors इसे असल में देखें। एक Date object plus एक DOM update एक live countdown है, कई event sites पर एक असली feature।
Summary
Key takeaways
- एक Date object एक moment hold करता है; new Date() अभी है, new Date(2026, 2, 12) 12 March 2026 है (month 0-indexed)।
- getFullYear, getMonth (0-11), getDate (1-31, day of month), getDay (0-6, day of week), getHours parts पढ़ते हैं।
- setFullYear/setMonth/setDate/setHours उन्हें बदलते हैं; toString readable text देता है।
- getMonth 0-indexed है: display करने को 1 जोड़िए, construct करने को 1 घटाइए (classic bug)।
- getDay (weekday) getDate (day of month) नहीं है, और कोई setDay नहीं है।
- Memory hook: month dial 0 से शुरू होता है; getDate = number, getDay = weekday।