सारांश और अगले कदम
यह पृष्ठ कोई नया सिंटैक्स नहीं जोड़ता। यह पूरे कोर्स को एक ऑर्डर पर समेटता है: पेय tea और आकार regular। जो पंक्ति तुम्हें समझा सकनी चाहिए वह tea / regular है।
यह पंक्ति कहाँ से आई
पहुँच वाले पृष्ठ ने इसे असली button type=button से लिखा। Mouse, Enter और Space वही क्लिक चलाते हैं। aria-live="polite" मौजूदा वाक्य के बाद बोलता है। अगर size नहीं है, तो button.disabled true होता है और बटन पृष्ठ पर रहता है। फ़ोकस बटन पर ही रहता है।
दो पहले की पंक्तियाँ
डिबग में { drink: "tea", size: "regular" } पर order.cup पढ़ा गया। वस्तु में size है, cup नहीं। console.error नहीं फेंकता, इसलिए स्क्रिप्ट आगे चलती है। वह पंक्ति fixed / tea / regular थी।
throw new Error("missing size") फ़ंक्शन label को return से पहले रोक देता है। catch error.message पढ़ता है, और वह missing size है। error.name Error है। finally दोनों स्थितियों में चलता है। वह पंक्ति caught / missing size थी।
सात पंक्तियाँ, एक ही क्रम
हर पंक्ति उसी ऑर्डर का एक टुकड़ा है। मिलता सत्र तभी खोलो जब परिणाम अभी पतला लगे।
📊 एक ऑर्डर से यह कोर्स क्या करता है
| समूह | तुम कर सकते हो | एक परिणाम |
|---|---|---|
| मान और प्रवाह | मान रखना, if से चुनना, सूची पर चलना | tea / regular |
| फ़ंक्शन | ऑर्डर लेना और पंक्ति लौटाना | tea / regular |
| वस्तु और सरणियाँ | फ़ील्ड पढ़ना, JSON पढ़ना, कॉपी करना | { drink: "tea", size: "regular" } |
| पृष्ठ | बटन ढूँढना और पंक्ति लिखना | tea / regular |
| इंतज़ार | एक async फ़ंक्शन रोकना; fetch Response देता है | response.ok फिर response.json() |
| नया सिंटैक्स | नाम निकालना, पाठ बनाना, वर्ग बनाना | tea / regular |
| देखभाल | असली गुण पढ़ना, जानकर फेंकना, बटन रखना | fixed / tea / regular फिर caught / missing size फिर tea / regular |
यह नक्शा केवल याद दिलाने के लिए है। यह दूसरा कोर्स नहीं है, और इसमें प्रश्न नहीं हैं।
मान और फ़ैसले
तुम tea और regular रखते हो, उनकी तुलना करते हो और दोहराते हो। if एक रास्ता चुनता है। break लूप छोड़ देता है। continue एक मद को छोड़कर आगे बढ़ता है।
फ़ंक्शन
एक फ़ंक्शन tea / regular लौटाता है। ऐरो फ़ंक्शन वही फ़ंक्शन छोटे रूप में है। closure बाहरी फ़ंक्शन के लौटने के बाद भी उस बंधन को देखता है।
वस्तु, JSON और सरणियाँ
JSON.parse पाठ को वस्तु बनाता है। map नई सरणी बनाता है। find एक मिलान लौटाता है। spread कॉपी करता है। rest वह जुटाता है जिसे तुमने नाम नहीं दिया। यह कॉपी उथली होती है।
पृष्ठ
querySelector बटन ढूँढता है। textContent पंक्ति लिखता है। setTimeout बाद में चलता है और बटन की जगह नहीं लेता।
इंतज़ार
await केवल उसी async फ़ंक्शन को रोकता है। शेष पृष्ठ चलता रहता है। async फ़ंक्शन हमेशा एक Promise लौटाता है। fetch एक Response पर पूरा होता है, पढ़े हुए शरीर पर नहीं। response.json() एक और Promise लौटाता है। HTTP 404 आमतौर पर fetch को अस्वीकार नहीं करता। response.ok देखो। नेटवर्क टूटने पर अस्वीकार हो सकता है।
नया सिंटैक्स
नाम से निकालने पर drink और size अलग होते हैं। गायब नेस्टेड वस्तु फेंक सकती है। टेम्पलेट चलते समय ${...} भरता है। मॉड्यूल window पर नहीं होते और HTTP से लोड होते हैं। बच्चा वर्ग this से पहले super बुलाता है। निजी फ़ील्ड वर्ग के अंदर रहता है।
जब क्रम ग़लत हो
size पढ़ो, वह गुण नहीं जो वस्तु में है ही नहीं। console.error नहीं फेंकता और अगली पंक्ति फिर भी चलती है। throw फ़ंक्शन रोकता है, और आगे केवल catch बढ़ता है। क्रिया बटन पर रखो। फ़ोकस की रूपरेखा दिखती रहने दो।
आगे क्या है
अगला पृष्ठ एक छोटी कार्य-सूची है: जोड़ना, पूरा चिह्नित करना और हटाना। वह अभी भी मुख्य मार्ग का हिस्सा है।
उसके बाद वैकल्पिक पृष्ठ हैं: strict mode, Map और Set, नियमित अभिव्यक्तियाँ, web storage, cookies, और वर्ग की विरासत। मुख्य मार्ग पूरा करने के लिए ये आवश्यक नहीं हैं।
ये पाँच पंक्तियाँ ज़ोर से बोलो
- बटन tea / regular लिखता है, और aria-live="polite" मौजूदा वाक्य के बाद बोलता है
- console.error नहीं फेंकता; डिबग वाली पंक्ति fixed / tea / regular थी
- throw new Error("missing size") label को return से पहले रोकता है; catch missing size पढ़ता है; वह पंक्ति caught / missing size थी
- fetch एक Response पर पूरा होता है; response.json() से पहले response.ok देखो
- अगला पृष्ठ कार्य-सूची है