ईएसएम मॉड्यूल: आयात / निर्यात

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

export

आप वही निर्यात करते हैं जिसे आप सार्वजनिक करना चाहते हैं। दो रूप:

// somma.js
export function somma(a, b) {
  return a + b;
}

export const PI = 3.14159;

या, फ़ाइल के अंत में:

function somma(a, b) {
  return a + b;
}
const PI = 3.14159;
export { somma, PI };

import

दूसरी फ़ाइल से:

// app.js
import { somma, PI } from './somma.js';

console.log(somma(1, 2)); // 3
console.log(PI); // 3.14159

ऑब्जेक्ट { somma, PI } नामों की वह सूची है जिसे आप आयात करना चाहते हैं। उन्हें मेल खाना चाहिए निर्यात किए गए नाम.

डिफ़ॉल्ट निर्यात

प्रत्येक मॉड्यूल में एक "मुख्य" निर्यात हो सकता है, बिना नाम के:

// log.js
export default function log(msg) {
  console.log('[app]', msg);
}

आप इसे स्थानीय रूप से नाम चुनकर आयात करते हैं:

import log from './log.js';
log('ciao');

का नाम बदलने

import { somma as plus } from './somma.js';
export { somma as add } from './somma.js'; // re-export

प्रति फ़ाइल एक "नेमस्पेस"।

मॉड्यूल पृथक हैं: फ़ाइल में घोषित एक चर वैश्विक दायरे में समाप्त नहीं होता है। आप इसे कहीं और दृश्यमान बनाने के लिए इसे स्पष्ट रूप से निर्यात करना होगा। यह एक बहुत बड़ा सुधार है पुराने स्कूल का जेएस जहां प्रत्येक <script> ने window साझा किया।

इसे अजमाएं

नीचे दिए गए अभ्यासों में आप वास्तविक import/export सिंटैक्स नहीं लिखेंगे - सैंडबॉक्स एक एकल है फ़ाइल. इसके बजाय, हम आपसे कोड को छोटे अलग-अलग फ़ंक्शंस में व्यवस्थित करने के लिए कहेंगे सहयोग करें, जैसा कि आप करते यदि प्रत्येक एक अलग फ़ाइल में होता।

व्यायाम की समीक्षा करें