ما المقصود بـ JavaScript؟

JavaScript هي لغة برمجة يستخدمها المطورون في بناء صفحات ويب تفاعلية. بدايةً من تحديث مواجز الوسائط الاجتماعية وحتى عرض الرسوم المتحركة والخرائط التفاعلية، يمكن لوظائف JavaScript أن تحسّن تجربة مستخدم وقع الويب. ونظرًا لأنها لغة برمجة نصية من طرف العميل، فإنها تعد واحدة من التقنيات الأساسية في شبكة الويب العالمية. على سبيل المثال، عندما ترى أثناء تصفح الإنترنت عرضًا دوّارًا للصور، أو قائمةً منسدلةً بطريقة انقر للعرض، أو تغيرًا ديناميكيًا في ألوان العناصر على صفحة ويب ، فكل هذا من تأثيرات JavaScript.

فيمَ تُستخدم JavaScript؟

في الماضي، كانت صفحات الويب ثابتة، كصفحات الكتاب. وكانت الصفحة الثابتة تعرض المعلومات في تخطيط ثابت، ولم تكن تفعل كل ما نتوقعه الآن من أي موقع ويب حديث. وظهرت JavaScript كتقنية من جانب المتصفح لإضفاء مزيدٍ من الديناميكية على تطبيقات الويب. وباستخدام JavaScript، يمكن للمتصفحات الاستجابة لتفاعل المستخدم وتغيير تخطيط المحتوى على صفحة الويب.

ومع تطور اللغة، أنشأ مطورو JavaScript مكتبات وأُطر عمل وممارسات برمجة وبدؤوا في استخدامها خارج متصفحات الويب. واليوم، يمكن استخدام JavaScript للتطوير من طرف العميل ومن طرف الخادم. خلال الأقسام الفرعية التالية، سنستعرض بعضًا من حالات الاستخدام الشائعة:

في الماضي، كانت صفحات الويب ثابتة، كصفحات الكتاب. وكانت الصفحة الثابتة تعرض المعلومات في تخطيط ثابت، ولم تكن تفعل كل ما نتوقعه الآن من أي موقع ويب حديث. وظهرت JavaScript كتقنية من جانب المتصفح لإضفاء مزيدٍ من الديناميكية على تطبيقات الويب. وباستخدام JavaScript، يمكن للمتصفحات الاستجابة لتفاعل المستخدم وتغيير تخطيط المحتوى على صفحة الويب.

ومع تطور اللغة، أنشأ مطورو JavaScript مكتبات وأُطر عمل وممارسات برمجة وبدؤوا في استخدامها خارج متصفحات الويب. واليوم، يمكن استخدام JavaScript للتطوير من طرف العميل ومن طرف الخادم. خلال الأقسام الفرعية التالية، سنستعرض بعضًا من حالات الاستخدام الشائعة:

 

كيف تعمل JavaScript؟

تعمل جميع لغات البرمجة من خلال ترجمة بناء جملة شبيه باللغة الإنجليزية إلى تعليمة برمجية للآلة، ويقوم نظام التشغيل بعد ذلك بتشغيلها. وتُصنف JavaScript على نطاق واسع باعتبارها لغة برمجة نصية أو لغة مفسَّرَة. تعليمة JavaScript البرمجية هي تعليمة مفسَّرَة، بمعني أنها تُترجم مباشرةً إلى التعليمة البرمجية الأساسية للغة الآلة من خلال محرك JavaScript. وباستخدام لغات برمجة أخرى، يقوم المحول البرمجي (المترجم) بتحويل التعليمة البرمجية بالكامل إلى تعليمة برمجية للآلة في خطوة منفصلة. ومن ثمّ، فإن جميع لغات البرمجة النصية هي لغات برمجة، ولكن ليست كل لغات البرمجة هي لغات برمجة نصية.

محرك JavaScript

محرك JavaScript هو برنامج حاسوبي يشغّل تعليمة JavaScript البرمجية. ورغم أن محركات JavaScript الأولى كانت عبارة عن أدوات تفسير (مترجمين)، إلا أن جميع المحركات الحديثة تستخدم التحويل في الوقت المناسب أو تحويل وقت التشغيل لتحسين الأداء.

JavaScript من جانب العميل

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

ويكتب مطورو تطبيقات الويب تعليمة JavaScript البرمجية بوظائف مختلفة مرتبطة بأحداث مختلفة، مثل النقر بالماوس أو تمرير الماوس. وتقوم هذه الوظائف بإجراء تغييرات على صفحات HTML وCSS.

وفيما يلي نظرة عامة حول كيفية عمل JavaScript من جانب العميل:

1.   يقوم المتصفح بتحميل صفحة ويب عند زيارة هذه الصفحة.

2.   أثناء التحميل، يقوم المتصفح بتحويل الصفحة وجميع عناصرها، مثل الأزرار والتسميات والمربعات المنسدلة، إلى هيكل بيانات يُسمى نموذج كائن المستند (DOM).

3.   يقوم محرك JavaScript الموجود بالمتصفح بتحويل تعليمة JavaScript البرمجية إلى بايت كود. وتصبح هذه التعليمة البرمجية بمثابة وسيط بين بناء جملة JavaScript والجهاز.

4.   تؤدي الأحداث المختلفة، مثل النقر بالماوس على أحد الأزرار، إلى تشغيل كتلة تعليمات JavaScript البرمجية المرتبطة. بعد ذلك، يقوم المحرك بترجمة البايت كود وإجراء تغييرات في نموذج DOM.

5.   يعرض المتصفح نموذج DOM الجديد.

JavaScript من جانب الخادم

يشير مصطلح JavaScript من جانب الخادم إلى استخدام لغة كتابة التعليمات البرمجية في منطقة الخادم بالواجهة الخلفية. وفي هذه الحالة، يُوضع محرك JavaScript على الخادم مباشرةً. كما يمكن لوظيفة JavaScript من جانب الخادم الوصول إلى قاعدة البيانات وتنفيذ عمليات منطقية مختلفة والاستجابة للأحداث المتنوعة الصادرة عن نظام تشغيل الخادم. تُعد الميزة الأساسية للبرمجة النصية من جانب الخادم هي إمكانية تخصيص استجابة موقع الويب تخصيصًا تامًا بناءً على متطلباتك وحقوق الوصول الخاصة بك وطلبات المعلومات الصادرة عن موقع الويب.

من جانب العميل مقابل من جانب الخادم

تصف كلمة ديناميكي كلا نوعي JavaScript، من جانب العميل ومن جانب الخادم. والمقصود بالسلوك الديناميكي هو القدرة على تحديث عرض صفحة الويب لإنشاء محتوى جديد على النحو المطلوب. ويظهر الفرق بين JavaScript من جانب العميل وJavaScript من جانب الخادم في طريقة كل منهما في إنشاء المحتوى الجديد. تنشئ التعليمات البرمجية من جانب الخادم محتوى جديدًا ديناميكيًا باستخدام منطق تطبيق وتعدِّل البيانات من خلال قاعدة البيانات. ومن ناحية أخرى، تنشئ JavaScript من جانب العميل محتوى جديدًا ديناميكيًا داخل المتصفح باستخدام منطق واجهة مستخدم وتعدِّل محتويات صفحة الويب الموجودة لدى العميل بالفعل. ورغم الاختلاف الطفيف للمعنى في السياقين إلا أن بينهما علاقة وثيقة ويعمل كلا النهجين معًا لتحسين تجربة المستخدم.

وخلافًا للتنفيذ في الميزات الديناميكية، هناك اختلاف آخر يظهر بين استخدامي JavaScript في الموارد التي يمكن للتعليمة البرمجية الوصول إليها. في JavaScript من جانب العميل، يتحكم المتصفح في بيئة وقت تشغيل JavaScript. ولا يمكن للتعليمة البرمجية الوصول إلا إلى الموارد التي يتيح المتصفح إمكانية الوصول إليها. على سبيل المثال، لا يمكن للتعليمة البرمجية كتابة المحتوى على القرص الثابت إلا إذا نقرت فوق زر تنزيل. ومن ناحية أخرى، يمكن للوظائف من جانب الخادم الوصول إلى جميع موارد جهاز الخادم حسب الحاجة.

ما المقصود بمكتبات JavaScript؟

مكتبات JavaScript هي مجموعات من أجزاء تعليمات برمجية مكتوبة مسبقًا ويمكن لمطوري الويب إعادة استخدامها في تنفيذ وظائف JavaScript القياسية. يتم توصيل تعليمة مكتبة JavaScript البرمجية ببقية التعليمات البرمجية الموجودة بالمشروع حسب الحاجة. إذا نظرت إلى التعليمة البرمجية لتطبيقات JavaScript باعتبارها البيت، فإن مكتبات JavaScript تُعد بمثابة الأثاث الجاهز الذي يستخدمه المطورون في تحسين كفاءة البيت.

فيما يلي بعض الاستخدامات الشائعة لمكتبات JavaScript:

العرض المرئي للبيانات

يُعد العرض المرئي للبيانات أمرًا بالغ الأهمية للمستخدمين لعرض الإحصائيات، على سبيل المثال، في لوحة الإدارة ولوحة المعلومات وقياسات الأداء.

تتضمن مكتبات مثل Chart.js وApexCharts وAlgolia Places وظائف مضمنة يمكنك استخدامها في إنشاء تطبيقات ويب تعرض البيانات في شكل مخططات بيانية وخرائط.

معالجة نموذج DOM

يمكنك استخدام مكتبات مثل مكتبة jQuery ومكتبة Umbrella JS لتسهيل تطوير الويب لأنها توفر تعليمة برمجية لوظائف مواقع الويب القياسية مثل الرسوم المتحركة للقوائم ومعارض الصور والأزرار ونوافذ lightbox وغير ذلك الكثير.

النماذج

جميع عمليات تطوير الويب تستخدم نماذج لزوار مواقع الويب للاتصال بأي شخص، وطلب المنتجات، والتسجيل في الأحداث. تعمل بعض مكتبات JavaScript مثل wForms، وLiveValidation، وValidanguage، وqForms على تبسيط وظائف النماذج، بما في ذلك التحقق من صحة النماذج والتخطيط والشروط والتحويل.

وظائف النص والرياضيات

يتعين على العديد من تطبيقات الويب حل المعادلات الرياضية ومعالجة التواريخ والأوقات والنصوص. وبدلاً من إرسال كل هذه الطلبات إلى الخادم، فإن التعامل مع بعضها من جانب العميل يكون أكثر كفاءة. يقوم مطورو الويب بذلك من خلال استخدام مكتبات JavaScript مثل Date.js، وSylvester، وJavaScript URL Library

ما المقصود بأُطر عمل JavaScript؟

كما هو الحال مع مكتبات JavaScript، فإن أُطر عمل JavaScript هي مجموعة من أجزاء تعليمات برمجية مكتوبة مسبقًا تؤدي وظائف مختلفةً ويمكن إعادة استخدامها. ولكن، رغم أن مكتبات JavaScript هي أداة متخصصة للاستخدام عند الطلب، فإن أُطر عمل JavaScript هي مجموعة أدوات كاملة تساعد في تشكيل أي تطبيق ويب وتنظيمه. ولو نظرت إلى التعليمة البرمجية لتطبيق JavaScript باعتبارها منزل، فإن إطار عمل JavaScript يُعد بمثابة المخطط المستخدم في بناء البيت.

وفيما يلي بعض الأمثلة لحالات استخدام أطر عمل JavaScript:

تطوير تطبيقات الويب وتطبيقات الأجهزة المحمولة

AngularJS هو إطار عمل يبسط عملية تطوير تطبيقات الويب واختبارها، مثل تطبيقات التجارة الإلكترونية وتطبيقات الوقت الفعلي وتطبيقات الفيديو. ويُعد React Native إطار عمل آخر يدعم تطوير تطبيقات الأجهزة المحمولة المعدة أصلاً لنظام تشغيل iOS ونظام تشغيل Android.

تطوير الويب المتجاوب

توفر مواقع الويب المتجاوبة للمستخدم تجربةً متسقةً عبر أي جهاز. على سبيل المثال، تتضمن الأجهزة المحمولة والأجهزة اللوحية شاشات أصغر من تلك الشاشات الموجود بأجهزة سطح المكتب وأجهزة الكمبيوتر المحمولة. ومن المؤكد أنك ترغب في أن يقوم موقع الويب بعرض البيانات وتقديمها بدقة حتى على الشاشة الأصغر، بدون الاقتصاص من أطراف الموقع، على سبيل المثال. ومن خلال استخدام أُطر عمل مثل Bootstrap وEmber.js، يمكن للمطورين الاستفادة من التصميم المتجاوب وتخصيص شكل موقع الويب ونمطه بسهولة عبر منصات مختلفة.

تطوير التطبيقات من جانب الخادم

Node.js هو إطار عمل JavaScript من جانب الخادم مفتوح المصدر يُشغّل تعليمة JavaScript البرمجية خارج المتصفح. يستخدم المطورون إطار العمل هذا في إنشاء تطبيقات من جانب الخادم قابلة للتوسع وسريعة وموثوقة. ويمكن لإطار العمل هذا التعامل مع طلبات HTTP وتدفق البيانات ودعم أنظمة الملفات وإدارة العمليات الخلفية المتعددة على نحو متزامن.

ما المقصود بلغة HTML وCSS؟

لغة ترميز النص التشعبي (HTML) ولغة أوراق الأنماط المتتالية (CSS) هما لغتا برمجة أخريان يستخدمهما المطورون في تطوير الواجهة الأمامية. وتُعد لغة HTML هي لبنة البناء الأساسية لمعظم صفحات الويب. تُكتب جميع الفقرات والأقسام والصور والعناوين والنصوص بلغة HTML. ويظهر المحتوى على موقع الويب حسب ترتيب كتابته بلغة HTML.

أما لغة CSS فهي لغة قواعد أنماط نستخدمها في تطبيق النمط على محتوى HTML. ويمكنك استخدامها في تصميم عناصر موقع الويب مثل ألوان الخلفية والخطوط والأعمدة والحدود.

لغة HTML مقابل لغة CSS مقابل JavaScript

تعمل اللغات الثلاث معًا لمنح المستخدم تجربةً إيجابيةً على أي موقع. ورغم أن لغة HTML ولغة CSS تتعاملان مع المحتوى الثابت بشكل أساسي، إلا أنهما قادرتان على التكامل مع تعليمة JavaScript البرمجية من جانب العميل لتحديث المحتوى ديناميكيًا أيضًا.

على سبيل المثال، يمكن لكتلة التعليمات البرمجية للبرنامج النصي بصفحة HTML أن تحتوي بداخلها على JavaScript. وحينئذٍ، يمكن للمتصفح معالجة كل من لغة HTML وتعليمة JavaScript البرمجية الداخلية عند تحميل صفحة HTML في المتصفح.
 

ما مزايا JavaScript؟

سهولة التعلم والاستخدام

استُلهم بناء جملة JavaScript من لغة برمجة Java وهو بناء سهل التعلم والترميز. ويستخدم المطورون JavaScript في جميع تطبيقات مواقع الويب وتطبيقات الأجهزة المحمولة تقريبًا للبرمجة النصية من جانب العميل. وخلال العقد الماضي، اكتسب Node.js أيضًا شعبية كبيرة لترميز الواجهة الخلفية. وقد تم ترميز العديد من منصات البث والفيديو الرئيسية في Node.js.

الحصول على استقلالية المنصة

على عكس لغات البرمجة الأخرى، يمكنك إدراج JavaScript في أي صفحة ويب واستخدامها مع الكثير من أُطر عمل تطوير مواقع الويب واللغات الأخرى. وبمجرد كتابتها، يمكنك تشغيل تعليمة JavaScript البرمجية على أي جهاز. ومن ثمّ، فإن JavaScript تجعل منصة تطوير التطبيقات منصةً مستقلةً.

تخفيف حمل الخادم

يمكنك استخدام JavaScript في تخفيف حمل الخادم وتقليل زحام الشبكة وذلك لأنها تُشغّل عمليات منطقية وتفعل الكثير من عمل الخادم من جانب العميل نفسه. على سبيل المثال، عند ملء استمارة التسجيل. تتحقق JavaScript بسرعة مما إذا كنت قد أدخلت رقمًا مؤلفًا من 10 خانات في حقل رقم الهاتف المحمول. فإذا أُرسلت هذه الطلبات إلى الخادم، فستتم إعادة تحميل صفحتك عند كل خطأ تقع فيه، ما يجعل عملية التسجيل بطيئةً للغاية ومملةً.

تحسين واجهة المستخدم

تقوم JavaScript بإنشاء مواقع ويب منسجمة تسهِّل العثور على المعلومات المعقدة ومعالجتها. يطبق المطورون JavaScript لزيادة الوظائف وقابلية القراءة ولجعل تفاعل مستخدم موقع الويب أكثر كفاءةً.

دعم التزامن

تستطيع JavaScript تشغيل عدة مجموعات مختلفة من التعليمات بالتوازي. وفي الخلفية، تتعامل Node.js مع استجابات الخادم الموسعة ومعالجتها بدون استهلاك نفس القدر من النطاق الترددي.

ما قيود JavaScript؟

لغات البرمجة تستخدم المتغيرات كعناصر نائبة لقيم البيانات الفعلية. على سبيل المثال، في كتلة التعليمة البرمجية، يمكن للمطور كتابة (x=5) و(y=x+1). عند تشغيل التعليمة البرمجية، يقوم الكمبيوتر تلقائيًا بتغيير (x) و (y) إلى 5 و6، على التوالي، لتنفيذ الوظائف عليها. وقد تكون البيانات أنواعًا مختلفة، مثل سلسلة من النصوص أو الأرقام أو التاريخ. وهذا هو السبب في أن معظم لغات البرمجة تتيح إمكانية تحديد نوع المتغير. وبمجرد تحديد نوع المتغير، فإنه لا يتغير؛ ولا يمكن تخزين الأرقام في متغيرات السلسلة.

على سبيل المثال، إذا أخبرت البرنامج أن (x) و(y) هما رقمان ثم أجريت العملية الحسابية x+y، فسيدرك الكمبيوتر أنهما رقمين ويجمعهما. ومن ناحية أخرى، إذا حددت (x) و(y) كسلاسل، فسيقوم عامل الجمع (+) بإلحاق السلسلتين معًا لإنشاء كلمة أطول.

لغة ضعيفة الكتابة

JavaScript هي لغة مكتوبة بأسلوب ضعيف، ما يعني أنها لا تسمح للمبرمج بتحديد نوع المتغير. ويمكن للمتغير تخزين أي نوع من البيانات في وقت التشغيل، وتقوم العمليات بافتراض نوع المتغير. ويمكن أيضًا تحويل النتيجة إلى نوع آخر من البيانات، على سبيل المثال، قد تأتي نتيجة العملية كسلسلة "5" بدلاً من الرقم 5. وقد يتسبب ذلك في حدوث أخطاء غير مقصودة في الترميز وأخطاء في التعليمة البرمجية بسبب الأخطاء الموجودة في الكتابة.

ما المقصود بـ TypeScript؟

TypeScript هي لغة برمجة تعمل على تحسين JavaScript من خلال إضافة الأنواع إلى بناء الجملة. تضيف TypeScript بناء جملة إضافيًا إلى JavaScript حتى تتمكن أدوات محرر التعليمات البرمجية من اكتشاف أخطاء الترميز مبكرًا. وفي الوقت نفسه، تتحول تعليمة TypeScript البرمجية إلى JavaScript وتتيح جميع المزايا نفسها التي كانت توفرها JavaScript. ويتم تشغيلها أيضًا في التطبيقات ومع أُطر عمل JavaScript ومكتباتها.

ما المقصود بـ AWS SDK for JavaScript؟

AWS SDK for JavaScript هي مجموعة من مكتبات JavaScript مفتوحة المصدر ومجانية الاستخدام تتكامل مع خدمات AWS. وهي تدعم تطوير واجهة برمجة التطبيقات (API)، وطبقات مجردة ذات مستوى أعلى، وثلاثة أنواع من التطبيقات، هي:

  • تطبيق JavaScript للمتصفح
  • تطبيق Node.js للخادم
  • تطبيق React Native للتطوير للأجهزة المحمولة

تُكتب AWS SDK for JavaScript بالكامل في TypeScript وبعد ذلك يتم تحويلها في JavaScript. وبالتالي، ستحصل على جميع مزايا TypeScript بدون أي مخاوف بشأن التوافق مع الإصدارات السابقة.

يمكنك البدء باستخدام AWS SDK for Java من خلال قراءة أمثلة التعليمات البرمجية ودليل الترحيل أو عن طريق تثبيته مباشرة من GitHub.

ما المقصود بـ AWS Amplify for JavaScript؟

AWS Amplify هي مجموعة من الميزات والأدوات المصممة لغرض معين وهي تتيح لمطوري الواجهة الأمامية لمواقع الويب والأجهزة المحمولة إنشاء تطبيقات متكاملة على AWS بصورة سريعة وسهلة. توفر مكتبات عميل Amplify مفتوحة المصدر واجهات سهلة الاستخدام تركز على حالة الاستخدام عبر فئات مختلفة من العمليات المدعومة بالسحابة. يتم دعم مكتبات Amplify JavaScript لأطر عمل الويب والجوال المختلفة، بما في ذلك React و React Native و Angular و Ionic و Vue.js. يمكنك البدء من خلال إكمال دليل البدء لـ Amplify JavaScript.

الخطوات التالية لـ JavaScript مع AWS