JavaScript परिचय
HTML पेज की संरचना देता है। CSS उसकी दिखने वाली शक्ल। दुकान की खिड़की तैयार हो, फिर भी तब तक शांत रहती है जब तक कुछ होता नहीं: क्लिक, टाइप की गई वैल्यू, या लोड के बाद दिखने वाला संदेश। JavaScript वही भाषा है जो ब्राउज़र में ये काम करती है।
JavaScript क्या है?
JavaScript एक प्रोग्रामिंग भाषा है। आप निर्देश लिखते हैं और ब्राउज़र उन्हें एक के बाद एक चलाता है। यह मार्कअप नहीं है (वह HTML है) और स्टाइलशीट भी नहीं (वह CSS है)। वेब पर इसका रोज़ का काम व्यवहार है: टेक्स्ट बदलना, यूज़र पर प्रतिक्रिया, कोई मान गिनना, और इस कोर्स में आगे — सर्वर से डेटा लाना।
दस्तावेज़ नहीं, चलने वाली भाषा
HTML टैग सामग्री के टुकड़ों को नाम देते हैं। CSS नियम बताते हैं कि वे कैसे दिखें। JavaScript स्टेटमेंट कंप्यूटर से कहते हैं कि कुछ करो: संदेश लिखो, पेज पर एक नोड बदलो, या दो संख्याएँ जोड़ो। स्क्रिप्ट जोड़ने जितना HTML आपके पास है। यह कोर्स उसी स्क्रिप्ट के अंदर चलने वाली भाषा सिखाता है।
📊 स्थिर पेज बनाम JavaScript वाला पेज
| स्थिति | बिना JavaScript | छोटे स्क्रिप्ट के साथ |
|---|---|---|
| पेज अभी लोड हुआ | शीर्षक HTML जैसा का तैसा रहता है | स्क्रिप्ट लोड के बाद उस शीर्षक को बदल सकती है |
| आगंतुक बटन पर क्लिक करता है | अकेले बटन से कुछ उपयोगी नहीं होता | बाद के सत्र: क्लिक पर कोड चलेगा |
| कुल या जाँच चाहिए | HTML गणना नहीं करता; CSS फ़ैसला नहीं करता | JavaScript गणना करके परिणाम दिखा सकता है |
तीन परतों को दिमाग में अलग रखें। संरचना HTML की। रूप CSS का। यह कोर्स तीसरी परत है: पेज क्या करता है।
स्टेटमेंट की पहली झलक
स्टेटमेंट एक निर्देश है। नीचे वाला उदाहरण डेवलपर कंसोल में एक पंक्ति लिखता है — प्रोग्रामर का औज़ार, दिखने वाला पेज नहीं। सीखते समय कंसोल बहुत काम आएगा।
console.log("Hello, JavaScript");
यह स्टेटमेंट क्या करता है
console.logएक बिल्ट-इन फ़ंक्शन है जो कंसोल में छापता है- उद्धरण में टेक्स्ट एक स्ट्रिंग है — यानी टेक्स्ट डेटा
- सेमीकोलन स्टेटमेंट खत्म करता है (इस कोर्स में सुरक्षित आदत)
- पेज पर अभी कुछ नहीं बदलता; यह सिर्फ़ लॉग है
डेवलपर टूल खोलें (अक्सर F12) और स्क्रिप्ट चलने के बाद Console टैब देखें।
पेज पर JavaScript देखना
जो आगंतुक देखता है उसे बदलने के लिए स्क्रिप्ट पेज से बात करती है। नीचे HTML पैराग्राफ़ एक वाक्य से शुरू होता है। इनलाइन <script> उसे id से ढूँढता है और टेक्स्ट बदल देता है। स्क्रिप्ट कहाँ रखें, अगले सत्र में; यहाँ एक फ़ाइल काफ़ी है।
<!DOCTYPE html>
<html>
<head>
<title>JavaScript Demo</title>
</head>
<body>
<h1>Welcome</h1>
<p id="msg">This line is from HTML only.</p>
<script>
document.getElementById("msg").textContent =
"JavaScript rewrote this sentence.";
</script>
</body>
</html>
क्या बदला
बिना स्क्रिप्ट के मूल पैराग्राफ़ रहता है। स्क्रिप्ट के साथ ब्राउज़र पहले HTML पढ़ता है, फिर स्टेटमेंट चलाता है, फिर नया वाक्य दिखाता है। कंकाल वही — लोड के बाद व्यवहार अलग।
JavaScript गणना भी करता है
प्रोग्रामिंग भाषा होने के कारण यह संख्याओं और नामों से काम करता है, सिर्फ़ टैग से नहीं। यह छोटा उदाहरण रंग या शीर्षक से जुड़ा नहीं। यह कुल निकालकर लॉग करता है। वेरिएबल और टाइप बाद में; यहाँ इतना काफ़ी है कि कोड गणना कर सकता है।
const price = 120000;
const taxRate = 0.09;
console.log(price + price * taxRate);
यह कोर्स क्या है (और क्या नहीं)
हम ब्राउज़र में रहते हैं: भाषा की नींव, DOM, इवेंट, फ़ॉर्म, और fetch। फ्रेमवर्क, Node.js या TypeScript से शुरुआत नहीं। उनके बिना भी उपयोगी पेज स्क्रिप्ट लिख सकते हैं। वैकल्पिक सत्र अतिरिक्त हैं; मुख्य रास्ते के लिए ज़रूरी नहीं।
खुद आज़माएँ
intro.htmlनाम की फ़ाइल बनाएँ।- HTML-plus-script उदाहरण चिपकाएँ, सहेजें, ब्राउज़र में खोलें।
- पैराग्राफ़ नया वाक्य दिखाए, मूल HTML टेक्स्ट नहीं।
textContentकी स्ट्रिंग अपना वाक्य बनाएँ, सहेजें और रिफ़्रेश करें।- वैकल्पिक: उसी
<script>मेंconsole.log("Hello, JavaScript");जोड़ें, सहेजें, रिफ़्रेश करें, Console टैब में पंक्ति ढूँढें।
आम गलतियाँ
- JavaScript को शीर्षक और पैराग्राफ़ लिखने का दूसरा तरीका मानना — संरचना HTML में रखें; ज़रूरत पर JS बदले या जोड़े
- CSS से क्लिक पर प्रतिक्रिया या कुल की गणना उम्मीद करना — CSS स्टाइल है; प्रोग्राम लॉजिक नहीं चलाता
- ज़रूरी टेक्स्ट की इकलौती कॉपी सिर्फ़ स्क्रिप्ट में रखना, ताकि JS न हो तो पेज खाली दिखे
- कंसोल और दिखने वाले पेज को मिलाना:
console.logस्क्रीन पर शीर्षक नहीं बदलता
सारांश
- JavaScript प्रोग्रामिंग भाषा है जो ब्राउज़र में पेज को व्यवहार देती है
- HTML सामग्री की संरचना; CSS प्रस्तुति; JavaScript तय करता है पेज क्या करे
- स्टेटमेंट एक निर्देश है, जैसे
console.log("Hello, JavaScript"); - इनलाइन स्क्रिप्ट एलिमेंट ढूँढकर लोड के बाद
textContentबदल सकती है - JavaScript मान भी गिनता है, सिर्फ़ मार्कअप नहीं छूता
- यह कोर्स ब्राउज़र में रहता है और फ्रेमवर्क नहीं माँगता
- छोटे स्क्रिप्ट को संपादित कर ब्राउज़र रिफ़्रेश करके अभ्यास करें
🧠 अपने ज्ञान की परीक्षा करें
अपने ज्ञान की परीक्षा करें
इस इंटरैक्टिव क्विज़ के साथ अपनी चुनौती लें और देखें कि आप विषय को कितनी अच्छी तरह समझते हैं
📝 निर्देश
- हर प्रश्न को ध्यान से पढ़ें
- हर प्रश्न के लिए सबसे अच्छा उत्तर चुनें
- आप जितनी बार चाहें क्विज़ दोबारा दे सकते हैं
- आपकी प्रगति शीर्ष पर दिखाई जाएगी