ESM ماڈیولز: درآمد / برآمد

جب کوئی پروگرام بڑھتا ہے تو سب کچھ ایک فائل میں رکھنا عجیب ہو جاتا ہے۔ جدید جاوا اسکرپٹ ES ماڈیولز (ESM) کے ساتھ مسئلہ حل کرتا ہے: ہر فائل ایک ماڈیول ہے جو برآمد کر سکتی ہے۔ فنکشن، مستقل، کلاسز، اور دیگر فائلیں انہیں درآمد کر سکتی ہیں۔

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

فی فائل ایک "نام کی جگہ"

ماڈیولز ** الگ تھلگ** ہیں: فائل میں اعلان کردہ متغیر عالمی دائرہ کار میں ختم نہیں ہوتا ہے۔ آپ اسے کسی اور جگہ دکھائی دینے کے لیے اسے واضح طور پر ایکسپورٹ کرنا ہوگا۔ یہ ایک بہت بڑی بہتری ہے۔ پرانے اسکول JS جہاں ہر <script> نے اشتراک کیا window۔

اسے آزمائیں

ذیل کی مشقوں میں آپ اصلی import/export نحو نہیں لکھیں گے — سینڈ باکس ایک واحد ہے فائل اس کے بجائے، ہم آپ سے کوڈ کو چھوٹے الگ فنکشنز میں ترتیب دینے کو کہیں گے۔ تعاون کریں، جیسا کہ آپ کریں گے اگر ہر ایک مختلف فائل میں ہوتا۔

ورزش کا جائزہ لیں۔