import এবং export এর ব্যবহার

ES6 এ import এবং export এর মাধ্যমে আপনি মডিউল (modules) ব্যবহার করতে পারবেন, যা কোডকে আরও সংগঠিত, পুনঃব্যবহারযোগ্য এবং ব্যতিক্রমীভাবে পরিচালনাযোগ্য করে তোলে। মডিউল ব্যবহারের মাধ্যমে আপনি কোডকে ছোট ছোট অংশে ভাগ করতে পারেন এবং একাধিক ফাইলের মধ্যে সেই অংশগুলি ব্যবহার করতে পারেন। import এবং export কিওয়ার্ডের মাধ্যমে এক ফাইল থেকে অন্য ফাইলে কোড শেয়ার করা যায়।

Export

export কিওয়ার্ডের মাধ্যমে আপনি এক বা একাধিক ভ্যারিয়েবল, ফাংশন, অথবা ক্লাসকে একটি ফাইল থেকে অন্য ফাইলে ব্যবহার করার জন্য এক্সপোর্ট করতে পারেন। দুই ধরনের export রয়েছে:

1. Named Export (নামযুক্ত এক্সপোর্ট)
2. Default Export (ডিফল্ট এক্সপোর্ট)

Named Export

Named Export এর মাধ্যমে আপনি একাধিক ভ্যারিয়েবল, ফাংশন বা ক্লাসকে নির্দিষ্ট নাম দিয়ে এক্সপোর্ট করতে পারেন। এখানে, এক্সপোর্ট করা ভ্যালুগুলোর নামের সাথে মিল থাকতে হবে।

সিনট্যাক্স:

// Named export
export const name = "John";
export function greet() {
  console.log("Hello, world!");
}

বা একসাথে:

const name = "John";
function greet() {
  console.log("Hello, world!");
}

export { name, greet };

এখন এই ফাংশন বা ভ্যারিয়েবলগুলি অন্য ফাইলে import করতে পারবেন।

উদাহরণ:

// anotherFile.js
import { name, greet } from './fileName';  // File name without extension

console.log(name);  // "John"
greet();            // "Hello, world!"

Default Export

Default Export এর মাধ্যমে আপনি একটি ফাইল থেকে একটিমাত্র ডিফল্ট এক্সপোর্ট করতে পারেন। এটি সাধারণত যখন ফাইলটি একটি একক মান বা ফাংশন/ক্লাস এক্সপোর্ট করে, তখন ব্যবহৃত হয়।

সিনট্যাক্স:

// Default export
export default function greet() {
  console.log("Hello from default!");
}

এখানে, আমরা একটি ফাংশন greet() ডিফল্ট হিসেবে এক্সপোর্ট করেছি। আপনি যখন এই ফাইলটি import করবেন, তখন আপনি যেকোনো নাম ব্যবহার করতে পারেন।

উদাহরণ:

// anotherFile.js
import greet from './fileName';

greet();  // "Hello from default!"

এখানে, greet ফাংশনটি ডিফল্টভাবে এক্সপোর্ট করা হয়েছে, তাই ফাংশনের নাম পরিবর্তন করে ব্যবহার করা যেতে পারে।

import

import কিওয়ার্ডের মাধ্যমে আপনি অন্য ফাইল থেকে এক্সপোর্ট করা ভ্যারিয়েবল, ফাংশন, বা ক্লাসকে আমদানি (import) করতে পারেন।

1. Named Imports: আপনি একাধিক নামযুক্ত এক্সপোর্টের মধ্যে থেকে প্রয়োজনীয়টি আমদানি করতে পারেন।
2. Default Import: একক ডিফল্ট এক্সপোর্ট আমদানি করতে ব্যবহৃত হয়।

Named Imports:

import { name, greet } from './fileName';  // Named imports
console.log(name);  // "John"
greet();            // "Hello, world!"

Default Import:

import greet from './fileName';  // Default import
greet();                       // "Hello from default!"

Named Export এবং Default Export এর পার্থক্য

1. একাধিক এক্সপোর্ট: Named Export এর মাধ্যমে আপনি একাধিক ভ্যালু এক্সপোর্ট করতে পারেন, whereas Default Export শুধুমাত্র একটিমাত্র এক্সপোর্ট করতে পারে।

   উদাহরণ:

   // Named Export: একাধিক এক্সপোর্ট করা সম্ভব
   export const name = "John";
   export const age = 30;
   
   // Default Export: শুধুমাত্র একটি এক্সপোর্ট
   export default function greet() {
     console.log("Hello!");
   }
   

2. Import Syntax: Named Export থেকে আমদানি করার জন্য {} ব্যবহার করতে হয়, কিন্তু Default Export এর ক্ষেত্রে {} ব্যবহার করা হয় না।

   উদাহরণ:

   // Named import
   import { name, age } from './fileName';
   
   // Default import
   import greet from './fileName';
   

Mixed Import (Named + Default)

একই ফাইলে আপনি Named Export এবং Default Export উভয়ই একসাথে ব্যবহার করতে পারেন এবং সেগুলো আলাদা আলাদা করে আমদানি করতে পারেন।

উদাহরণ:

// fileName.js
export const name = "John";
export function greet() {
  console.log("Hello!");
}
export default function farewell() {
  console.log("Goodbye!");
}

// anotherFile.js
import farewell, { name, greet } from './fileName';

console.log(name);  // "John"
greet();            // "Hello!"
farewell();         // "Goodbye!"

import এবং export এর সুবিধা

1. কোড মডুলারিটি: কোডকে ছোট ছোট অংশে ভাগ করার মাধ্যমে কাজের পরিসর বাড়ানো যায়। একাধিক ফাইলের মধ্যে কোড ভাগ করে এবং একে অপরের সাথে শেয়ার করা যায়।
2. পুনঃব্যবহারযোগ্য কোড: আপনি একবার এক্সপোর্ট করা কোডটি বারবার ব্যবহার করতে পারেন অন্য ফাইলগুলোতে।
3. নামকরণে সুবিধা: Named Export এর মাধ্যমে আপনি কোডের অংশগুলোর নাম স্পষ্টভাবে নির্ধারণ করতে পারেন, যা কোডের বোধগম্যতা বাড়ায়।
4. ক্লিন ও সংগঠিত কোড: মডিউল ব্যবহারের মাধ্যমে আপনার কোড আরো পরিষ্কার, সংগঠিত এবং সহজে রক্ষণাবেক্ষণযোগ্য হয়।

এইভাবে import এবং export এর মাধ্যমে আপনি ES6 মডিউল সিস্টেম ব্যবহার করে কোডকে আরও সংগঠিত ও দক্ষভাবে পরিচালনা করতে পারবেন।