JavaScript Modules – সম্পূর্ণ বাংলা টিউটোরিয়াল
যখন আপনার প্রজেক্ট বড় হতে থাকে, তখন সমস্ত কোড এক জায়গায় রাখা অগোছালো এবং জটিল হয়ে পড়ে। একারণে JavaScript Modules ব্যবহার করা হয় কোডকে ছোট ছোট ভাগে ভাগ করে রাখতে এবং প্রয়োজনমতো ব্যবহার করতে। ES6 থেকে JavaScript এ module system যোগ করা হয়েছে যা import ও export এর মাধ্যমে কাজ করে।
JavaScript Modules কি?
JavaScript Module হল একটি আলাদা ফাইল যাতে কিছু নির্দিষ্ট ফাংশন, ভেরিয়েবল বা ক্লাস রাখা যায়। তারপর এই module অন্য ফাইলে import করে ব্যবহার করা যায়।
Basic Export এবং Import
export const add = (a, b) => a + b;
export const subtract = (a, b) => a - b;
import { add, subtract } from './math.js';
console.log(add(10, 5)); // 15
উপরের উদাহরণে math.js ফাইল থেকে named exports ব্যবহার করে দুটি ফাংশন import করা হয়েছে।
Named Export vs Default Export
Named Export: একাধিক ফাংশন বা ভ্যারিয়েবল export করা যায়। Import করার সময় নাম অনুযায়ী ব্যবহার করতে হয়।
Default Export: একটি ফাইল থেকে একটি মূল export করা হয়। Import করার সময় নাম পরিবর্তন করে নেওয়া যায়।
export default function greet(name) {
return `Hello, ${name}!`;
}
import greetUser from './defaultExport.js';
console.log(greetUser("Rahim")); // Hello, Rahim!
Mixed Export
একই ফাইলে default এবং named export দুটোই রাখা যায়।
const PI = 3.1416;
export const square = x => x * x;
export default PI;
Import Everything
আপনি চাইলে একসাথে সব কিছু import করে নিতে পারেন একটি object আকারে:
import * as MathUtils from './math.js';
console.log(MathUtils.add(5, 3)); // 8
Modules HTML-এ কীভাবে কাজ করে?
আপনার <script> ট্যাগে type=”module” যুক্ত করতে হবে:
<script type="module" src="main.js"></script>
Modules-এর সুবিধা
- Code Reusability
- Encapsulation (private scopes)
- Maintenance-friendly
- Multiple developers easily collaborate করতে পারে
Modules সংক্রান্ত কিছু গুরুত্বপূর্ণ নিয়ম
| নিয়ম | ব্যাখ্যা |
|---|---|
| import/export সবসময় ফাইলের টপ-লেভেলে হতে হবে | if বা function block এর ভিতরে নয় |
| .js ফাইলের path অবশ্যই দিতে হবে | import ‘./module.js’ ভুললে error দিবে |
| Browser support | Modern browser গুলো support করে |
উপসংহার
JavaScript Modules আপনার অ্যাপ্লিকেশনকে গুছিয়ে রাখতে সাহায্য করে। এটি code reusability বাড়ায় এবং large application build করতে সুবিধা দেয়। বর্তমান সময়ের library/framework যেমন React, Vue, Angular সবগুলোতেই module system ব্যবহার হয়।