Skip to content

1. مقدمة إلى لغة ECMASCRIPT 6

PDF الخاص بهذا المقال متاح |HERE|.

الأمثلة الواردة في هذه المقالة متاحة |HERE|.

هذا المستند جزء من سلسلة من أربع مقالات:

  1. [مقدمة إلى لغة PHP7 من خلال الأمثلة (2019)؛
  1. [مقدمة إلى لغة ECMASCRIPT6 من خلال الأمثلة (2019)]. هذا هو المستند الحالي؛
  2. [مقدمة إلى إطار عمل VUE.JS من خلال الأمثلة (2019)
  3. [مقدمة إلى إطار عمل NUXT.JS من خلال الأمثلة (2019)

جميعها وثائق للمبتدئين. المقالات متسلسلة منطقياً ولكنها غير مترابطة بشكل كبير:

  • يقدم المستند [1] لغة PHP 7. القارئ الذي يهتم فقط بلغة PHP وليس بلغة جافا سكريبت في المقالات التالية سيتوقف عند هذا الحد؛
  • تهدف الوثائق [2-4] إلى إنشاء عميل Javascript لخادم حساب الضريبة الذي تم تطويره في الوثيقة [1]؛
  • تتطلب أطر عمل Javascript [vue.js] و [nuxt.js] الواردة في المادتين 3 و 4 معرفة لغة Javascript في أحدث إصدارات ECMASCRIPT، وهي الإصدارات 6. لذلك، فإن الوثيقة [2] مخصصة لأولئك الذين لا يعرفون هذه النسخة من جافا سكريبت. وهي تشير إلى خادم حساب الضريبة الذي تم إنشاؤه في الوثيقة [1]. قد يحتاج قارئ [2] أحيانًا إلى الرجوع إلى المستند [1]؛
  • وبمجرد إتقان ECMASCRIPT 6، يمكننا الانتقال إلى إطار العمل VUE.JS الذي يسمح بإنشاء عملاء جافا سكريبت يعملون في متصفح في وضع SPA (تطبيق صفحة واحدة). هذا هو المستند [3]. وهو يشير في الوقت نفسه إلى خادم حساب الضريبة الذي تم إنشاؤه في المستند [1] وإلى كود عميل جافا سكريبت المستقل الذي تم إنشاؤه في [2]. سيحتاج قارئ [3] أحيانًا إلى الرجوع إلى المستندين [1] و [2]؛
  • وبمجرد إتقان VUE.JS، يمكننا الانتقال إلى إطار العمل NUXT.JS الذي يسمح بإنشاء عملاء جافا سكريبت يعملون في متصفح في وضع SSR (Server Side Rendered). وهو يشير في الوقت نفسه إلى خادم حساب الضريبة الذي تم إنشاؤه في المستند [1]، إلى كود عميل جافا سكريبت المستقل الذي تم إنشاؤه في [2] وكذلك إلى تطبيق [vue.js] الذي تم تطويره في المستند [3]. سيحتاج قارئ [4] أحيانًا إلى الرجوع إلى المستندات [1] و [2] و [3]؛

يمكن تحسين أحدث إصدار من خادم حساب الضريبة الذي تم تطويره في المستند [1] بعدة طرق:

  • تركز النسخة المكتوبة على الخادم. الاتجاه السائد حاليًا (يوليو 2019) هو نموذج العميل/الخادم:
    • يعمل الخادم في الخدمة jSON؛
    • تعد الصفحة الثابتة أو غير الثابتة نقطة الدخول إلى تطبيق الويب. تحتوي هذه الصفحة على HTML /CSS وكذلك على جافا سكريبت؛
    • يتم الحصول على الصفحات الأخرى للتطبيق الويب ديناميكيًا بواسطة جافا سكريبت:
      • يمكن الحصول على الصفحة HTML عن طريق تجميع أجزاء ثابتة، مقدمة من نفس الخادم الذي قدم الصفحة الرئيسية أو مبنية بالكامل بواسطة جافا سكريبت؛
      • تعرض هذه الصفحات المختلفة البيانات المطلوبة من الخدمة jSON؛

وبالتالي، يتم توزيع العمل بين العميل والخادم. وبذلك، يمكن للخادم الذي تم تخفيف العبء عنه خدمة المزيد من المستخدمين.

البنية المطابقة لهذا النموذج هي التالية:

Image

JS: جافا سكريبت

كود جافا سكريبت هو عميل:

  • لخدمة صفحات أو أجزاء ثابتة أو غير ثابتة؛
  • من خدمة jSON؛

وبالتالي، فإن كود جافا سكريبت هو عميل jSON، وبهذه الصفة يمكن تنظيمه في طبقات [UI, métier, dao] (UI: واجهة المستخدم) كما تم تنظيم عملائنا jSON المكتوبين بلغة PHP. في النهاية، لا يقوم المتصفح بتحميل سوى صفحة واحدة، وهي الصفحة الرئيسية. يتم الحصول على جميع الصفحات الأخرى وبناؤها بواسطة جافا سكريبت. يُطلق على هذا النوع من التطبيقات اسم SPA: تطبيق صفحة واحدة أو APU: تطبيق ذو صفحة واحدة.

يندرج هذا النوع من التطبيقات أيضًا ضمن ما يُعرف باسم AJAX: Asynchronous Javascript و XML

  • غير متزامن: لأن استدعاءات عميل جافا سكريبت إلى خادم jSON غير متزامنة؛
  • XML: لأن XML كانت التقنية المستخدمة قبل ظهور jSON. ومع ذلك، تم الاحتفاظ بالاختصار AJAX؛

سندرس مثل هذه البنية في الفصول القادمة. من جانب العميل، سنستخدم إطار عمل جافا سكريبت [Vue.js] [https://vuejs.org/] لكتابة عميل جافا سكريبت للخادم jSON PHP الذي كتبناه في الوثيقة [1].

[Vue.js] هو إطار عمل جافا سكريبت. لفهمه، يجب إتقان هذه اللغة. نقدم في هذا المستند المعيار ECMAScript 6 الذي يعد أحدث معيار (في عام 2019) لهذه اللغة. يمكن العثور على تاريخ ودور ECMAScript على ويكيبيديا [https://fr.wikipedia.org/wiki/ECMAScript].

يقدم هذا المستند قائمة ببرامج جافا سكريبت للوحدة المركزية في مجالات مختلفة (هياكل اللغة، والوصول إلى قواعد البيانات، والإنترنت، والبرمجة الطبقية، والبرمجة عبر الواجهات). وينتهي المستند بتطبيقين:

تطبيق وحدة التحكم الذي سيكون عميلاً لخادم حساب الضرائب الذي تم إنشاؤه في الوثيقة [1]. سيكون لهذا العميل نفس بنية عميل وحدة التحكم PHP الذي تم إنشاؤه في الوثيقة [1]:

Image

  • ستكون طبقات [7-9] هي طبقات عميل Javascript الذي يعمل في وحدة التحكم؛
  • طبقات [1-4] هي طبقات الخادم PHP 7 الذي تم إنشاؤه في المستند [1]؛
  • على عكس عميل وحدة التحكم PHP الذي تم إنشاؤه في المستند [1]، لن تكون هناك تفاعلات مع نظام الملفات المحلي [6]؛

لدينا هنا تطبيق عميل/خادم حيث يكون العميل تطبيق وحدة تحكم. سيتم كتابة تطبيق ثانٍ حيث سيتم نقل كود طبقات [7-9] إلى متصفح. سنكون عندئذ جاهزين لتناول أطر عمل جافا سكريبت للمتصفحات في الوثيقتين [3] و [4].

تم توضيح البرامج النصية في هذا المستند وتكرار تنفيذها على وحدة التحكم. يتم تقديم تفسيرات إضافية في بعض الأحيان. يتطلب المستند قراءة نشطة: لفهم البرنامج النصي، يجب قراءة الكود والتعليقات ونتائج التنفيذ في آن واحد.

Serge Tahé، أكتوبر 2019