Google Play badge

जावास्क्रिप्ट


शुरुआती लोगों के लिए जावास्क्रिप्ट

जावास्क्रिप्ट का परिचय

नमस्ते युवा मित्रों! आज हम जावास्क्रिप्ट के बारे में जानने जा रहे हैं। जावास्क्रिप्ट एक खास तरह की कंप्यूटर भाषा है। यह हमें वेब पेजों को इंटरैक्टिव और मजेदार बनाने में मदद करती है। जब आप किसी बटन पर क्लिक करते हैं या वेबसाइट पर कुछ हिलता हुआ देखते हैं, तो यह अक्सर जावास्क्रिप्ट की वजह से होता है।

कल्पना करें कि आप एक खिलौना रोबोट के साथ खेल रहे हैं। रोबोट को चलाने के लिए, आपको उसे यह बताना होगा कि उसे क्या करना है। उसी तरह, जावास्क्रिप्ट कंप्यूटर को बताता है कि वेब पेज को कैसे व्यवहार करना चाहिए। यह आपको वेबसाइट को बदलते समय निर्देश देता है।

वेब डेवलपमेंट का मतलब है वेबसाइट बनाना। जब हम HTML के साथ काम करते हैं, तो हम वेबसाइट की संरचना बनाते हैं। CSS वेबसाइट को सुंदर बनाता है। जावास्क्रिप्ट बटन क्लिक करने या पेज को नीचे स्क्रॉल करने पर वेबसाइट को प्रतिक्रिया देकर जादू जोड़ता है। आज, हम यह पता लगाएंगे कि जावास्क्रिप्ट बहुत सरल तरीके से कैसे काम करता है।

यह पाठ आसान भाषा में लिखा गया है। हम रोज़मर्रा की ज़िंदगी से सरल शब्दों और उदाहरणों का उपयोग करेंगे। भले ही आप कंप्यूटर के लिए नए हों, आप इस पाठ को समझ सकते हैं। आइए जावास्क्रिप्ट के साथ अपने सीखने के रोमांच की शुरुआत करें!

जावास्क्रिप्ट क्या है?

जावास्क्रिप्ट एक ऐसी भाषा है जिसे कंप्यूटर समझते हैं। यह निर्देशों का एक सेट है जिसे इस तरह से लिखा जाता है कि कंप्यूटर उसका पालन कर सके। जब आप किसी वेबसाइट पर जाते हैं, तो कंप्यूटर पेज के कुछ हिस्सों को बदलने के लिए जावास्क्रिप्ट का उपयोग करता है। उदाहरण के लिए, जब आप माउस क्लिक करते हैं तो कोई तस्वीर दिखाई दे सकती है या कोई संदेश पॉप अप हो सकता है।

आप जावास्क्रिप्ट को एक दोस्ताना सहायक के रूप में सोच सकते हैं। जैसे आप किसी मित्र से खिलौना मांग सकते हैं, वैसे ही जावास्क्रिप्ट आपके कंप्यूटर को संदेश भेजने और स्क्रीन पर बदलाव दिखाने में मदद करता है। यह वेबसाइटों को जीवन देता है।

कई लोकप्रिय वेबसाइटें जावास्क्रिप्ट का उपयोग करती हैं। ऑनलाइन गेम, इंटरैक्टिव स्टोरीज और यहां तक ​​कि सरल एनिमेशन जैसी वेबसाइटें भी जावास्क्रिप्ट के साथ काम करती हैं। यह एक जादुई औषधि की तरह है जो वेबसाइट को रोमांचक बनाती है।

जानें कि जावास्क्रिप्ट कैसे धीरे-धीरे काम करता है। चरण दर चरण, आप देखेंगे कि प्रत्येक निर्देश किसी वेबसाइट को कैसे बदल सकता है। हम आपको यह समझने में मदद करने के लिए सरल उदाहरण दिखाएंगे कि यह कैसे काम करता है।

वेब विकास में जावास्क्रिप्ट क्यों महत्वपूर्ण है?

जावास्क्रिप्ट बहुत महत्वपूर्ण है क्योंकि यह इंटरेक्शन बनाता है। कल्पना करें कि अगर आप जो भी किताब पढ़ते हैं, उसे बिना किसी विकल्प के पढ़ा जा सके। जावास्क्रिप्ट के बिना एक वेबसाइट वैसी ही है - एक स्थिर पेज जो कभी नहीं बदलता।

जावास्क्रिप्ट के साथ, आप चलती हुई तस्वीरें, बदलते हुए टेक्स्ट और बटन देखते हैं जो आपके क्लिक करने पर कुछ काम करते हैं। यह वेबसाइटों को जीवंत और मज़ेदार बनाता है। यहां तक ​​कि एक साधारण वेबसाइट, जैसे कि एक चित्र गैलरी, जावास्क्रिप्ट का उपयोग करके रोमांचक बन सकती है।

जब भी आप किसी वेबसाइट पर पॉप-अप संदेश या छोटा सा गेम देखते हैं, तो आप जावास्क्रिप्ट के काम को देख रहे होते हैं। यही कारण है कि आपको कभी-कभी "स्वागत है!" या "क्लिक करने के लिए धन्यवाद!" जैसे संदेश दिखाई देते हैं।

जावास्क्रिप्ट का उपयोग करके, वेब डेवलपर्स ऐसी वेबसाइटें बना सकते हैं जो सुंदर और उपयोगी दोनों हों, तथा यह सुनिश्चित करें कि आगंतुक ऑनलाइन अपना समय आनंदपूर्वक बिता सकें।

जावास्क्रिप्ट HTML और CSS के साथ कैसे काम करता है

जब हम कोई वेबसाइट बनाते हैं, तो हम HTML से शुरुआत करते हैं। HTML एक वेबपेज के ढांचे की तरह है। यह दिखाता है कि चित्र, टेक्स्ट और बटन कहाँ जाते हैं। फिर हम रंग और स्टाइल जोड़ने के लिए CSS का उपयोग करते हैं। CSS कपड़ों की तरह है जो ढांचे को आकर्षक बनाता है।

वेबसाइट को इंटरैक्टिव बनाने के लिए HTML और CSS के ऊपर जावास्क्रिप्ट को जोड़ा जाता है। यह मस्तिष्क की तरह है जो वेबसाइट को बताता है कि जब कोई उससे इंटरैक्ट करता है तो उसे क्या करना है।

उदाहरण के लिए, जब आप किसी वेबपेज पर किसी बटन पर क्लिक करते हैं, तो HTML बटन दिखाता है, CSS उसे अच्छा दिखाता है, और JavaScript वेबपेज को एक छिपा हुआ संदेश दिखाने के लिए कहता है। यह संयोजन वेबसाइटों को स्मार्ट और फ्रेंडली बनाता है।

आइए एक उदाहरण देखें। मान लीजिए हमारे पास एक वेबपेज है जिस पर एक बटन है जिस पर लिखा है "मुझे क्लिक करें!"। जब आप बटन पर क्लिक करते हैं, तो जावास्क्रिप्ट एक संदेश दिखाता है जिसमें लिखा होता है "हैलो, दोस्त!" यह एक छोटी लेकिन अद्भुत चीज़ है जिसे इंटरएक्टिविटी कहा जाता है।

जावास्क्रिप्ट के बुनियादी निर्माण खंड

मज़ेदार उदाहरणों पर जाने से पहले, हमें जावास्क्रिप्ट में कुछ बुनियादी शब्द सीखने की ज़रूरत है। ये बिल्डिंग ब्लॉक की तरह हैं जो हमें निर्देश लिखने में मदद करते हैं। सबसे महत्वपूर्ण ब्लॉक में से कुछ वैरिएबल, फ़ंक्शन और इवेंट हैं।

चर: चर एक छोटे से बॉक्स की तरह होता है। इस बॉक्स में आप कुछ खास रख सकते हैं। यह कोई शब्द, कोई संख्या या कोई तस्वीर भी हो सकती है। जब हम बाद में उस मान का उपयोग करना चाहते हैं, तो हम उसे बॉक्स से बाहर निकाल लेते हैं।

उदाहरण के लिए, आपके पास 'नाम' नाम का एक बॉक्स हो सकता है जिसमें "ऐलिस" शब्द संग्रहीत होता है। इसे एक स्टिकी नोट पर लिखकर बॉक्स में रखने जैसा समझें, ताकि जब भी आपको नाम जानना हो, तो आप बस नोट पढ़ लें।

फ़ंक्शन: फ़ंक्शन निर्देशों का एक समूह है जो एक साथ काम करते हैं। यह एक रेसिपी की तरह है जो कंप्यूटर को बताती है कि केक कैसे बनाया जाए। हर बार जब आप केक बनाना चाहते हैं, तो आप एक ही परिणाम पाने के लिए रेसिपी (या फ़ंक्शन) का पालन करते हैं।

जब हम जावास्क्रिप्ट लिखते हैं, तो हम सरल कार्य करने के लिए फ़ंक्शन बना सकते हैं। उदाहरण के लिए, जब आप कोई गेम शुरू करते हैं या कोई वेबपेज देखते हैं, तो फ़ंक्शन स्वागत संदेश प्रदर्शित कर सकता है।

इवेंट: इवेंट वह होता है जो वेबपेज पर होता है। जब आप कोई बटन क्लिक करते हैं, अपना माउस घुमाते हैं या कोई कुंजी दबाते हैं, तो ये क्रियाएँ इवेंट होती हैं। जावास्क्रिप्ट इन इवेंट को सुनता है और फिर कुछ घटित करता है। यह किसी के दरवाजे पर आने पर घंटी बजने जैसा है।

जावास्क्रिप्ट कोड के सरल उदाहरण

आइए जावास्क्रिप्ट कोड के कुछ बहुत ही सरल उदाहरण देखें। ये उदाहरण दिखाते हैं कि हम कंप्यूटर को निर्देश कैसे देते हैं।

उदाहरण 1: संदेश प्रदर्शित करना

यहां एक छोटा सा कोड है जो एक संदेश दिखाता है:

 <code>var message = "नमस्ते, दुनिया!";
चेतावनी(संदेश);</code>

इस कोड में, var शब्द कंप्यूटर को message नाम का एक बॉक्स बनाने और उस बॉक्स के अंदर "Hello, world!" शब्द संग्रहीत करने के लिए कहता है। फिर alert() कमांड उस संदेश को आपकी स्क्रीन पर एक छोटी विंडो में दिखाता है।

उदाहरण 2: फ़ंक्शन का उपयोग करना

यहाँ एक सरल फ़ंक्शन है जो अभिवादन दिखाता है:

 <कोड>
फ़ंक्शन अभिवादन() {
  चेतावनी("नमस्ते, मित्र!");
}
  </कोड>

इस फ़ंक्शन का नाम greet है। जब फ़ंक्शन का उपयोग किया जाता है, तो यह कंप्यूटर को "हैलो, मित्र!" अभिवादन के साथ एक विंडो दिखाने के लिए कहता है।

उदाहरण 3: क्लिक का जवाब देना

आप बटन पर क्लिक करके वेबपेज को कुछ करने के लिए कह सकते हैं। इस कोड को देखें:

 <कोड>
<button onclick="greet()">मुझे क्लिक करें!</button>
  </कोड>

यहाँ, जब आप "क्लिक मी!" बटन दबाते हैं, तो अभिवादन फ़ंक्शन सक्रिय हो जाता है, और आपको अभिवादन संदेश दिखाई देता है। यह दिखाता है कि जावास्क्रिप्ट आपके द्वारा की गई गतिविधियों को सुनता है और उसके अनुसार पेज में बदलाव करता है।

सरल उदाहरणों से चरों को समझना

आइए चरों के बारे में ज़्यादा जानें। चर एक ऐसा नाम है जो किसी बॉक्स को दिया जाता है जिसमें कोई मान होता है, जैसे कि कोई संख्या या शब्द। चर को अपने पसंदीदा खिलौने के डिब्बे के रूप में सोचें जहाँ आप अपने पसंदीदा खिलौने रखते हैं। आप किसी भी समय बॉक्स के अंदर देख सकते हैं कि वहाँ क्या है।

उदाहरण के लिए, आप अपनी उम्र को स्टोर करने के लिए age नामक एक वैरिएबल बना सकते हैं या अपना पसंदीदा रंग स्टोर करने के लिए color नामक एक वैरिएबल बना सकते हैं। जब आप JavaScript का उपयोग करते हैं, तो आप जब चाहें इन मानों को बदल सकते हैं, ठीक वैसे ही जैसे आप अपने बॉक्स में कोई नया खिलौना डालते हैं।

इस तरह, चर आपको जानकारी सहेजने और बाद में उसका उपयोग करने में मदद करते हैं। यह आपके कोड को व्यवस्थित और पढ़ने में आसान बनाता है। जैसे-जैसे आप और अधिक सीखेंगे, आप देखेंगे कि प्रोग्राम लिखने में चर बहुत महत्वपूर्ण हैं।

कार्यों के बारे में सीखना

फ़ंक्शन कोड के विशेष ब्लॉक होते हैं जो कोई कार्य कर सकते हैं। कल्पना करें कि आपके पास कहानी की किताब में एक जादुई मंत्र है। हर बार जब आप जादुई शब्द बोलते हैं, तो कुछ अद्भुत होता है। जावास्क्रिप्ट में, फ़ंक्शन उस जादुई मंत्र की तरह होता है।

आप किसी फ़ंक्शन के अंदर निर्देशों की एक सूची लिखते हैं, और फिर जब भी आपको ज़रूरत हो, आप उस फ़ंक्शन का उपयोग करके कार्य कर सकते हैं। इससे आपको बार-बार एक ही निर्देश लिखने से बचने में मदद मिलती है।

उदाहरण के लिए, यदि आप कई अलग-अलग पेजों पर "हैलो!" कहना चाहते हैं, तो आप एक फ़ंक्शन लिख सकते हैं और हर बार उसे कॉल कर सकते हैं। इससे आपका कोड छोटा और सुव्यवस्थित रहता है। फ़ंक्शन आपके काम को आसान बनाते हैं और आपके प्रोग्राम को ज़्यादा व्यवस्थित बनाते हैं।

जावास्क्रिप्ट में घटनाएँ

इवेंट वे क्रियाएँ हैं जो वेबपेज पर होती हैं। वे एक क्लिक, माउस की हरकत या वेबपेज लोड होने पर भी हो सकती हैं। जावास्क्रिप्ट इन घटनाओं को सुनता है और उन पर प्रतिक्रिया करता है।

ज़रा सोचिए जब आप घर पर डोरबेल बजाते हैं। डोरबेल बजती है और कोई आपसे मिलने आता है। वेबपेज पर जब आप किसी बटन पर क्लिक करते हैं, तो जावास्क्रिप्ट उस क्लिक को सुनता है और फिर कुछ करता है—बिलकुल डोरबेल की तरह।

उदाहरण के लिए, आपके पास एक बटन हो सकता है जो पेज का रंग बदलता है। जब आप बटन पर क्लिक करते हैं, तो एक इवेंट ट्रिगर होता है और जावास्क्रिप्ट रंग बदल देता है। यह दिखाता है कि कैसे सरल इवेंट किसी वेबसाइट को जीवंत और मज़ेदार बना सकते हैं।

इवेंट एक मुख्य विशेषता है जो वेब पेजों को इंटरैक्टिव बनाती है। वे कंप्यूटर को वास्तविक समय में आपके द्वारा की जाने वाली गतिविधियों पर प्रतिक्रिया देने में मदद करते हैं।

एक सरल इंटरैक्टिव उदाहरण

आइए इन विचारों को एक सरल उदाहरण के साथ जोड़ते हैं। कल्पना करें कि एक वेबपेज जो बटन पर क्लिक करने पर आपका स्वागत करता है। यहाँ कोड का एक सरल संस्करण है जिसे आप देख सकते हैं:

 <कोड>
<!DOCTYPE html>
<एचटीएमएल>
  <शीर्ष>
    <title>स्वागत पृष्ठ</title>
    <स्क्रिप्ट>
      फ़ंक्शन sayHello() {
        चेतावनी("हमारी वेबसाइट पर आपका स्वागत है!");
      }
    </स्क्रिप्ट>
  </शीर्ष>
  <शरीर>
    <h1>नमस्ते!</h1>
    <p>स्वागत संदेश देखने के लिए नीचे दिए गए बटन पर क्लिक करें.</p>
    <button onclick="sayHello()">मुझे क्लिक करें!</button>
  </शरीर>
</html>
  </कोड>

यह कोड एक सरल वेबपेज बनाता है। HTML पेज बनाता है, CSS (यदि जोड़ा गया है) इसे आकर्षक बनाता है, और जावास्क्रिप्ट बटन को काम करता है। जब आप बटन पर क्लिक करते हैं, तो sayHello फ़ंक्शन सक्रिय हो जाता है और एक संदेश पॉप अप होता है।

यह एक बुनियादी प्रदर्शन है कि जावास्क्रिप्ट कैसे एक स्थिर वेबपेज में रोमांच ला सकता है। यह आपको दिखाता है कि कोड के छोटे-छोटे टुकड़े आपकी स्क्रीन पर होने वाली गतिविधियों को कैसे बदल सकते हैं।

जावास्क्रिप्ट के वास्तविक-विश्व अनुप्रयोग

जावास्क्रिप्ट का इस्तेमाल कई ऐसी वेबसाइट पर किया जाता है, जिन पर आप हर दिन जाते हैं। उदाहरण के लिए, जब आप ऑनलाइन शॉपिंग वेबसाइट का इस्तेमाल करते हैं, तो जावास्क्रिप्ट पेज को फिर से लोड किए बिना शॉपिंग कार्ट को अपडेट करने में मदद करता है। जब आप सोशल मीडिया फ़ीड को स्क्रॉल करते हैं, तो जावास्क्रिप्ट सुनिश्चित करता है कि नई पोस्ट आसानी से दिखाई दें।

वेब पेजों पर कैलकुलेटर जैसे सरल उपकरण भी जावास्क्रिप्ट के साथ काम करते हैं। एक कैलकुलेटर की कल्पना करें जो संख्याओं को जोड़, घटा, गुणा या भाग कर सकता है। जावास्क्रिप्ट कैलकुलेटर के काम करने के लिए निर्देश लिखता है, ठीक वैसे ही जैसे आप संख्याओं को गिनने और जोड़ने के लिए अपनी उंगलियों का उपयोग कर सकते हैं।

खेलों की दुनिया में, जावास्क्रिप्ट मज़ेदार अनुभव बनाने में मदद करता है। रंगीन एनिमेशन, चलते-फिरते पात्र और इंटरैक्टिव पहेलियाँ सभी जावास्क्रिप्ट की वजह से संभव हैं। यह हमारी डिजिटल दुनिया को और भी ज़्यादा आकर्षक बनाता है।

हर बार जब आप किसी गतिशील वेबसाइट के साथ इंटरैक्ट करते हैं - चाहे आप मौसम की जांच कर रहे हों, वीडियो देख रहे हों, या गेम खेल रहे हों - जावास्क्रिप्ट उस अनुभव को सहज और प्रतिक्रियाशील बनाने के लिए पर्दे के पीछे काम कर रहा है।

जावास्क्रिप्ट के साथ मज़ेदार प्रोजेक्ट

जैसे-जैसे आप बड़े होते हैं और जावास्क्रिप्ट के बारे में अधिक सीखते हैं, आप अपने खुद के छोटे प्रोजेक्ट बनाना शुरू कर सकते हैं। आप एक सरल ड्राइंग ऐप बना सकते हैं जहाँ आप अपने माउस का उपयोग करके चित्र बना सकते हैं, या एक छोटा सा गेम बना सकते हैं जहाँ पात्र स्क्रीन पर घूमते हैं। संभावनाएँ अनंत हैं!

प्रोजेक्ट्स आपकी इच्छानुसार सरल या जटिल हो सकते हैं। यहां तक ​​कि रंग बदलने वाले एक साधारण बटन से शुरू करना भी एक मजेदार प्रोजेक्ट हो सकता है। हर छोटे प्रोजेक्ट के साथ, आप इस बारे में थोड़ा और सीखते हैं कि जावास्क्रिप्ट किस तरह से काम करता है।

इन परियोजनाओं में, आप आज सीखे गए बुनियादी विचारों का उपयोग करेंगे: जानकारी संग्रहीत करने के लिए चर, कार्य करने के लिए फ़ंक्शन और इंटरैक्शन को संभालने के लिए ईवेंट। प्रत्येक परियोजना आपको एक बेहतर समस्या-समाधानकर्ता और अधिक रचनात्मक विचारक बनने में मदद करती है।

स्क्रैच से कुछ बनाने की खुशी बहुत रोमांचक है। जावास्क्रिप्ट के साथ, आपके पास विचारों को वास्तविक डिजिटल अनुभवों में बदलने की शक्ति है। यह एक चित्र बनाने और फिर पात्रों को जीवन में लाने जैसा है!

जावास्क्रिप्ट सीखने के लिए सुझाव

नई भाषा सीखना मज़ेदार और दिलचस्प हो सकता है। यहाँ कुछ सरल सुझाव दिए गए हैं जो जावास्क्रिप्ट के साथ आपकी यात्रा में आपकी मदद कर सकते हैं:

याद रखें, हर विशेषज्ञ कभी न कभी नौसिखिया होता है। जावास्क्रिप्ट कैसे काम करता है, यह जानने की प्रक्रिया का आनंद लें, और जल्द ही आप अपनी खुद की अद्भुत वेबसाइट बनाने में सक्षम होंगे।

अधिक उन्नत विचारों की खोज (धीमी गति से)

जैसे-जैसे आप जावास्क्रिप्ट के साथ अधिक सहज होते जाएंगे, आप अधिक उन्नत विचारों के बारे में सुन सकते हैं। लेकिन चिंता न करें! अभी के लिए, मूल बातों पर ध्यान केंद्रित करें। जब आप तैयार हों, तो आप लूप, शर्तों और सरणियों के बारे में सीख सकते हैं।

उदाहरण के लिए, लूप एक मेरी-गो-राउंड की तरह होता है जो घूमता है और एक ही कार्य को कई बार दोहराता है। परिस्थितियाँ कंप्यूटर को निर्णय लेने में मदद करती हैं - जैसे वेबपेज पर जो कुछ होता है उसके आधार पर दो अलग-अलग क्रियाओं के बीच चयन करना।

ये विचार अतिरिक्त स्वाद की तरह हैं जो आपकी कोडिंग को और भी रोमांचक बनाते हैं। जब आप बड़े हो जाते हैं और जावास्क्रिप्ट से अधिक परिचित हो जाते हैं, तो आप धीरे-धीरे इन उन्नत विचारों को आज़मा सकते हैं। आज, सरल टुकड़ों को सीखना ही पर्याप्त है।

सीखने का हर छोटा-सा हिस्सा भविष्य के लिए एक मजबूत नींव बनाता है। जावास्क्रिप्ट सीखने में आपके द्वारा उठाए गए हर कदम पर गर्व करें!

सारांश

इस पाठ में हमने जाना:

ध्यान रखें कि जावास्क्रिप्ट सीखना एक यात्रा है। अभ्यास का हर पल आपको अधिक स्मार्ट और अधिक रचनात्मक बनाता है। सीखने का आनंद लें और वेब डेवलपमेंट के जादू को जानने का मज़ा लें!

Download Primer to continue