تطورت لغة البرمجة جافاسكريبت بشكل كبير في السنوات الأخيرة، وأضيفت إليها مزايا كثيرة بغرض جعلها لغة برمجة أكثر تطورا وحداثة.
هذا الإيقاع الجنوني في تحديث JavaScript صاحبه تباطؤ على مستوى دمج هذه التغييرات ودعمها من طرف متصفحات الويب الكبيرة وعلى رأسها كروم وفايرفوكس. وفي الحقيقة هذا التباطؤ منطقي ومفهوم، إذ ليس سهلا أن تقوم هذه المتصفحات بتحديث محركات الجافاسكريبت الخاصة بها دفعة واحدة بين عشية وضحاها لتلائم هذا الكم الهائل من المستجدات.
الحل من أجل تدارك هذا التأخر هو وضع آلية لتحويل أكواد جافاسكريبت الحديثة (مثلا أكواد جافاسكريبت ES6) إلى أكواد أقدم تدعمها المتصفحات بشكل تام.
هذه العملية تعرف ب Transpiling وهي تجميع للكلمتين Transforming و Compiling.
إذن ما ستكتبه أنت كمطور هو الشفرة البرمجية الحديثة لجافاسكريبت، بينما الشفرة التي سنقوم باستدعائها في المتصفح هي الشفرة القديمة التي تم توليدها بالإستعانة ب Transpiler أو المحول الذي نعتمد عليه في مرحلة بناء المشروع أو ما يعرف ب Build process.
ولكن لما كل هذا العناء إذا كنت في الأخير سأستخدم الشفرة القديمة ؟
قد يسأل أحدهم: لماذا كل هذه المشقة والعناء في إعداد عملية build process إذا كنا في الأخير سنعطي الشفرة البرمجية القديمة للمتصفح ؟
هذا سؤال مشروع ووجيه، ويمكن الرد عليه من خلال النقاط التالية:
- الواجهات البرمجية والأكواد الحديثة في جافاسكريبت صممت لكي تجعل شفراتنا المصدرية أكثر قابلية للقراءة والصيانة. وعندما نتحدث عن هذا العاملين لا يجب أن نفكر في أنفسنا فقط، بل أيضا في الفريق أو الأشخاص الذين نعمل معهم، حيث أن كتابة أكواد نظيفة ومنظمة يساعد الجميع في الإنخراط بشكل جيد في العمل ومعرفة الغرض الأساسي من أي كود برمجي.
- يمكن أن نوجه الأكواد المحولة (Transpiled code) فقط إلى المتصفحات القديمة التي لا تدعم التركيب الجديد، بينما نطلب من المتصفحات الحديثة مثل كروم أن تقوم باستخدام الأكواد الحديثة، حيث أن متصفح غوغل يدعم نسبة كبيرة جدا من جافاسكريبت ES6 ولو أنه في العادة لا يلجأ المطورون إلى هذا الخيار لأنه ينطوي على بعض الصعوبات في تنفيذه على أرض الواقع.
- استخدام الأكواد الحديثة في مشاريع حقيقية وواقعية يعطي فرصة لأعضاء لجنة TC39 المكلفة بتطوير لغة البرمجة جافاسكريبت للحصول على آراء ودود فعل المطورين حول العالم من أجل تحسين ما يمكن تحسينه. وكلما جاءت ردود الفعل هذه في وقت مبكر كلما كان ذلك أحسن من أجل تحديث ما يمكن تحديثه وتحسين ما يمكن تحسينه.
مثال صغير
القيمة الإفتراضية للمعامل أو Default parameter value كانت إحدى المزايا التي جاء مع إصدار ES6 من جافاسكريبت، حيث أن هذه الميزة لم تكن موجودة في هذه اللغة من قبل كما هي موجودة في لغات أخرى معروفة مثل PHP على سبيل المثال.
بفضل جافاسكريبت ES6 أصبح بإمكاننا إعطاء قيمة افتراضية لمعاملات الدوال كما يلي:
function foo(a = 2) {
console.log(a);
}
foo(); // 2
foo(42); // 42إذا قمنا بعملية Transpiling على الدالة foo ـ باستخدام Babeljs مثلا ـ فسنحصل على الشفرة البرمجية التالية:
function foo() {
var a = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 2;
console.log(a);
}تلاحظون أن الدالة هنا تتأكد من أن عدد العوامل المررة أكبر قطعا من صفر وأن العامل الأول يخالف undefined ، إذا تحقق هذا الشرط هذا يعني بأننا قمنا بتمرير بارامتر إلى الدالة، إذا نأخذ قيمة هذا البارامتر وفي حالة العكس نأخذ 2 كقيمة افتراضية.
بالنسبة لمطور مبتدئ وغير متمرس قد يكون هذا الكود صعبا قليلا وغير قابل للفهم من النظرة الأولى، بينما الميزة الجديدة في ES6 تمكننا من عمل ذلك ب Syntax واضح وسهل التذكر مهما كان مستوى المطور.
أشهر Transpilers
هناك عدد من المحولات التي تستخدم في بيئة جافاسكريبت، ولكن أشهرها على الإطلاق هو Babel.js الذي لا نكاد نجد أي مشروع ويب كبير ( مثال React.js و Vue.js) إلا ويعتمد عليه.
تقنية Transpiling تعتمد عليها كذلك بعض لغات البرمجة التي بنيت فوق جافاسكريبت مثل Typescript الذي يستخدم هو الآخر في مشاريع الويب إما منفردا أو مع أطر عمل أخرى (خاصة مع أنغولار)، حيث أن أكواد Typescript يتم تحويلها في مرحلة البناء إلى أكواد جافاسكريبت تفهمها المتصفحات.
- قد يهمك أيضا: إعداد مشروع React.js من الصفر باستخدام Webpack 4 و Babel
