لكن داخليا، JavaScript ترى الأمر بطريقة مختلفة تماما.
في الحقيقة...
كل ملف JavaScript مستقل (.js) يعتبر برنامجا منفصلا بحد ذاته.
كل ملف JavaScript مستقل (.js) يعتبر برنامجا منفصلا بحد ذاته.
وهذه الفكرة تبدو بسيطة، لكنها غيرت طريقة بناء تطبيقات الويب بالكامل.
لنفترض أن لدينا صفحة تحتوي على ملفين:
html
<script src="a.js"></script>
<script src="b.js"></script>وفي الملف الأول:
javascript
var username = "Ali";ثم في الملف الثاني:
javascript
console.log(username);الغريب أن هذا سيعمل !
كيف استطاع الملف الثاني الوصول إلى متغير موجود في ملف آخر؟
السبب هو أن JavaScript القديمة كانت تعتمد على ما يسمى الـ Global Scope.
أي أن الملفات لم تكن "منعزلة" فعليا، بل كانت تشارك نفس المساحة العامة داخل المتصفح (window).
فعندما نكتب:
javascript
var username = "Ali";فإن JavaScript تتعامل معها تقريبا وكأننا كتبنا:
text
window.username = "Ali";ولهذا تستطيع بقية الملفات الوصول إليه.
في البداية بدا هذا السلوك عمليا وبسيطا...
لكن مع تطور التطبيقات وازدياد حجم المشاريع، بدأت المشاكل تظهر بسرعة.
ماذا لو أن ملفين مختلفين استخدما نفس اسم المتغير؟
javascript
var data = "users";وفي ملف آخر:
javascript
var data = "products";هنا سيقوم أحدهما بالكتابة فوق الآخر، وقد تظهر أخطاء يصعب جدا تتبعها.
ومع وجود عشرات أو مئات الملفات، تحولت الـ Global Scope إلى فوضى حقيقية.
ومن هنا ظهرت واحدة من أهم الإضافات في تاريخ JavaScript الحديث:
ES6 Modules.
بدل أن تشارك كل الملفات نفس المساحة العامة، أصبح لكل ملف "نطاقه الخاص" (Private Scope).
ولم يعد بإمكان ملف الوصول لما داخل ملف آخر إلا بشكل صريح وواضح باستخدام:
javascript
export
importمثلا:
javascript
// math.js
export function add(a, b) {
return a + b;
}ثم في ملف آخر:
javascript
// app.js
import { add } from "./math.js";
console.log(add(2, 3));وهنا يحدث فرق جوهري في فلسفة اللغة.
في JavaScript القديمة:
كانت الملفات "تتسرب" إلى بعضها تلقائيا عبر الـ Global Scope.
أما مع الـ Modules:
فلا شيء يُشارك إلا إذا قرر المطور تصديره بشكل واضح.
وهذا جعل الكود:
- أكثر تنظيما
- أسهل للفهم
- أقل عرضة للتصادمات
- وأفضل بكثير للعمل الجماعي داخل المشاريع الضخمة
كما أن الـ Modules لم تكن مجرد تحسين تنظيمي فقط، بل أصبحت الأساس الذي بنيت عليه بيئة JavaScript الحديثة بالكامل.
فأغلب التقنيات الحديثة مثل: React ،Vue، Angular ،Node.js، TypeScript
تعتمد بشكل أساسي على نظام الـ Modules.
والأجمل من ذلك أن ملفات الـ Modules تعمل تلقائيا في Strict Mode، أي أن JavaScript جعلت "الأسلوب الحديث" أكثر أمانا دون الحاجة لتغيير سلوك المواقع القديمة.
وهنا نلاحظ مرة أخرى نفس فلسفة JavaScript الشهيرة:
بدل أن نكسر الماضي...
نقوم ببناء مستقبل أفضل بجانبه.
نقوم ببناء مستقبل أفضل بجانبه.