ES Modules

1. ई एस मॉड्यूल

ई एस मॉड्यूल (ES Modules) जावास्क्रिप्ट के लिए एक मानकीकृत मॉड्यूल सिस्टम है जो आधुनिक वेब विकास में एक महत्वपूर्ण भूमिका निभाता है। यह पिछले मॉड्यूल सिस्टम (जैसे CommonJS और AMD) की कमियों को दूर करता है और कई फायदे प्रदान करता है, जैसे बेहतर कोड संगठन, पुन: प्रयोज्यता, और प्रदर्शन। यह लेख शुरुआती लोगों के लिए ई एस मॉड्यूल की गहन समझ प्रदान करेगा, जिसमें इसकी अवधारणा, सिंटैक्स, लाभ और उपयोग के उदाहरण शामिल हैं। यह लेख जावास्क्रिप्ट के संदर्भ में लिखा गया है।

ई एस मॉड्यूल क्या हैं?

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

ई एस मॉड्यूल ECMAScript 2015 (जिसे ई एस 6 भी कहा जाता है) में पेश किए गए थे और अब अधिकांश आधुनिक ब्राउज़र और नोड.जेएस (Node.js) द्वारा समर्थित हैं।

ई एस मॉड्यूल का सिंटैक्स

ई एस मॉड्यूल दो मुख्य कीवर्ड का उपयोग करते हैं: export और import।

export: यह कीवर्ड किसी फ़ंक्शन, वेरिएबल, क्लास या अन्य एंटिटी को मॉड्यूल से बाहर निर्यात करने के लिए उपयोग किया जाता है, ताकि इसे अन्य मॉड्यूल में आयात किया जा सके।
import: यह कीवर्ड किसी अन्य मॉड्यूल से निर्यातित एंटिटी को वर्तमान मॉड्यूल में आयात करने के लिए उपयोग किया जाता है।

उदाहरण:

मॉड्यूल निर्यात करना (module_a.js)

```javascript // module_a.js export function add(a, b) {

 return a + b;

}

export const PI = 3.14159;

export class MyClass {

 constructor(name) {
   this.name = name;
 }
 greet() {
   console.log("Hello, my name is " + this.name);
 }

} ```

मॉड्यूल आयात करना (module_b.js)

```javascript // module_b.js import { add, PI } from './module_a.js'; import MyClass from './module_a.js';

console.log(add(2, 3)); // Output: 5 console.log(PI); // Output: 3.14159

const myInstance = new MyClass("Alice"); myInstance.greet(); // Output: Hello, my name is Alice ```

इस उदाहरण में, `module_a.js` तीन एंटिटी निर्यात करता है: एक फ़ंक्शन `add`, एक स्थिरांक `PI`, और एक क्लास `MyClass`। `module_b.js` इन तीनों एंटिटी को `module_a.js` से आयात करता है और उनका उपयोग करता है।

विभिन्न प्रकार के आयात और निर्यात

ई एस मॉड्यूल विभिन्न प्रकार के आयात और निर्यात का समर्थन करते हैं:

Named Exports: यह सबसे आम प्रकार का निर्यात है, जिसमें आप विशिष्ट एंटिटी को नाम से निर्यात करते हैं। ऊपर दिए गए उदाहरण में, हमने नेमड एक्सपोर्ट का उपयोग किया था।
Default Export: प्रत्येक मॉड्यूल में केवल एक डिफ़ॉल्ट निर्यात हो सकता है। डिफ़ॉल्ट निर्यात को आयात करने के लिए, आप किसी भी नाम का उपयोग कर सकते हैं।

   ===डिफ़ॉल्ट निर्यात (module_c.js)===

   ```javascript
   // module_c.js
   export default function subtract(a, b) {
     return a - b;
   }
   ```

   ===डिफ़ॉल्ट आयात (module_d.js)===

   ```javascript
   // module_d.js
   import sub from './module_c.js';

   console.log(sub(5, 2)); // Output: 3
   ```

Namespace Import: आप किसी मॉड्यूल से सभी निर्यातित एंटिटी को एक ही नेमस्पेस ऑब्जेक्ट में आयात कर सकते हैं।

   ===नेमस्पेस आयात (module_e.js)===

   ```javascript
   // module_e.js
   import * as MathUtils from './module_a.js';

   console.log(MathUtils.add(4, 5)); // Output: 9
   console.log(MathUtils.PI); // Output: 3.14159
   ```

Alias Import: आप आयात करते समय किसी निर्यातित एंटिटी को एक अलग नाम दे सकते हैं।

   ===एलियास आयात (module_f.js)===

   ```javascript
   // module_f.js
   import { add as sum } from './module_a.js';

   console.log(sum(6, 7)); // Output: 13
   ```

ई एस मॉड्यूल के लाभ

ई एस मॉड्यूल कई लाभ प्रदान करते हैं, जिनमें शामिल हैं:

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

ई एस मॉड्यूल का उपयोग करने के लिए उपकरण

ई एस मॉड्यूल का उपयोग करने के लिए कई उपकरण उपलब्ध हैं, जिनमें शामिल हैं:

बंडलर (Bundlers): वेबपैक (Webpack), पार्सल (Parcel), और रोलअप (Rollup) जैसे बंडलर ई एस मॉड्यूल को एक या अधिक बंडल फ़ाइलों में जोड़ते हैं जिन्हें ब्राउज़र में उपयोग किया जा सकता है। वेबपैक कॉन्फ़िगरेशन एक महत्वपूर्ण पहलू है।
ट्रांसपाइलर (Transpilers): बेबल (Babel) जैसे ट्रांसपाइलर ई एस मॉड्यूल को पुराने ब्राउज़रों के साथ संगत कोड में परिवर्तित करते हैं।
नोड.जेएस (Node.js): नोड.जेएस संस्करण 12 से ई एस मॉड्यूल का समर्थन करता है। आपको अपने पैकेज.json फ़ाइल में `"type": "module"` जोड़ना होगा ताकि नोड.जेएस को पता चले कि आप ई एस मॉड्यूल का उपयोग कर रहे हैं। नोड पैकेज मैनेजर (npm) का उपयोग मॉड्यूल प्रबंधित करने के लिए किया जाता है।

ई एस मॉड्यूल और CommonJS

CommonJS मॉड्यूल सिस्टम, जो पहले नोड.जेएस में उपयोग किया जाता था, ई एस मॉड्यूल से अलग है। CommonJS सिंक्रोनस रूप से मॉड्यूल लोड करता है, जबकि ई एस मॉड्यूल एसिंक्रोनस रूप से मॉड्यूल लोड करता है। इसका मतलब है कि ई एस मॉड्यूल बेहतर प्रदर्शन प्रदान करते हैं, खासकर वेब ब्राउज़र में।

ई एस मॉड्यूल बनाम CommonJS
सुविधा	ई एस मॉड्यूल	CommonJS
लोडिंग	एसिंक्रोनस	सिंक्रोनस
सिंटैक्स	`import` और `export`	`require()` और `module.exports`
प्रदर्शन	बेहतर	कम
ब्राउज़र समर्थन	व्यापक	सीमित
निर्भरता प्रबंधन	स्पष्ट	निहित

ई एस मॉड्यूल के साथ सर्वश्रेष्ठ अभ्यास

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

ई एस मॉड्यूल और वेब विकास

ई एस मॉड्यूल आधुनिक वेब विकास का एक अभिन्न अंग बन गए हैं। वे जटिल वेब अनुप्रयोगों को व्यवस्थित करने और प्रबंधित करने का एक शक्तिशाली तरीका प्रदान करते हैं। फ्रंट-एंड फ्रेमवर्क जैसे रिएक्ट (React), एंगुलर (Angular), और Vue.js ई एस मॉड्यूल पर आधारित हैं।

ई एस मॉड्यूल के साथ उन्नत अवधारणाएं

Dynamic Imports: आप रनटाइम पर मॉड्यूल को गतिशील रूप से आयात करने के लिए import() फ़ंक्शन का उपयोग कर सकते हैं। यह कोड विभाजन और लेजी लोडिंग के लिए उपयोगी है।
Top-Level Await: ई एस मॉड्यूल में, आप टॉप-लेवल अवेट का उपयोग कर सकते हैं, जिसका अर्थ है कि आप एसिंक्रोनस फ़ंक्शन के बाहर await कीवर्ड का उपयोग कर सकते हैं।
Circular Dependencies: ई एस मॉड्यूल में, आप चक्रीय निर्भरता (जहां दो या दो से अधिक मॉड्यूल एक-दूसरे पर निर्भर होते हैं) से बच सकते हैं।

निष्कर्ष

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

अभी ट्रेडिंग शुरू करें

IQ Option पर रजिस्टर करें (न्यूनतम जमा $10) Pocket Option में खाता खोलें (न्यूनतम जमा $5)

हमारे समुदाय में शामिल हों

हमारे Telegram चैनल @strategybin से जुड़ें और प्राप्त करें: ✓ दैनिक ट्रेडिंग सिग्नल ✓ विशेष रणनीति विश्लेषण ✓ बाजार की प्रवृत्ति पर अलर्ट ✓ शुरुआती के लिए शिक्षण सामग्री