Global Scope vs Module Scope

জাভাস্ক্রিপ্টে স্কোপ খুবই গুরুত্বপূর্ণ একটি বিষয়। এখানে দুইটি প্রধান স্কোপের তুলনা করে ব্যাখ্যা করা হলো — Global Scope এবং Module Scope।

ধরো, তুমি একটা স্কুলে আছো…

• Global scope হলো পুরো স্কুল — যেকোনো ক্লাসের স্টুডেন্ট, টিচার, সবাই একে অপরকে চিনতে পারে।
• Module scope হলো শুধু একটা ক্লাস — ঐ ক্লাসের ভিতরের ছাত্ররা একে অপরকে চিনে, কিন্তু অন্য ক্লাসের কেউ জানে না কে কে আছে, unless তারা নিজেদের পরিচয় দেয় (মানে export করে)।

JavaScript-এ “Global Scope” মানে এই না যে সেটা অন্য ফাইল থেকেও গ্লোবালি অ্যাক্সেস করা যাবে।

👉 এটা শুধুই ঐ একটা স্ক্রিপ্ট বা HTML ফাইলের মধ্যে গ্লোবাল।

যদি আলাদা ফাইল হয়, সেটা আর সেই গ্লোবাল স্কোপে পড়ে না unless explicitly import করা হয়।

🔹 উদাহরণ ১ – সাধারণ স্ক্রিপ্ট (script mode)

<!-- index.html -->
<script src="a.js"></script>
<script src="b.js"></script>

// a.js
var name = "Rahim"; // এটা গ্লোবাল স্কোপে আছে

// b.js
console.log(name); // ✅ এটা কাজ করবে, কারণ দুইটা একই গ্লোবাল স্কোপে

✅ কারণ দুইটা স্ক্রিপ্ট ট্যাগ একসাথে লোড হয়েছে — তাই name একে অপরকে দেখতে পাচ্ছে।

🔹 উদাহরণ ২ – মডিউল ইউজ করলে

<script type="module" src="a.js"></script>
<script type="module" src="b.js"></script>

// a.js
let name = "Rahim"; // module scoped

// b.js
console.log(name); // ❌ ReferenceError: name is not defined

❌ এখন দুইটা ফাইল নিজস্ব আলাদা স্কোপে — একে অপরকে দেখতেই পায় না!

✍️ সংক্ষেপে:

✅ Bottom Line:

👉 “Global” বলতে JavaScript বোঝায় একটা স্ক্রিপ্ট বা environment-এর ভেতরে গ্লোবাল,

কিন্তু ফাইল আলাদা হলে, সেটা automatically গ্লোবাল না, unless browser একই স্কোপে চালায়।

🧠 মূল পার্থক্য

📌 সারাংশ:

• ছোটখাটো স্ক্রিপ্টের জন্য Global Scope সুবিধাজনক, কিন্তু বড় অ্যাপ বা মডিউলার কোডের জন্য এটা ঝুঁকিপূর্ণ।
• Module Scope নিরাপদ, রিইউজেবল এবং React/Next.js-এর মতো ফ্রেমওয়ার্কে ডিফল্টভাবেই ব্যবহৃত হয়।
• সব modern JavaScript কোডই এখন module scope এ লেখা হয়।