21/02/2024
اساسيات جافا سكريبت للمبتدئين

تعرف على جافا سكريبت Javascript واستخداماتها

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

ما هي جافا سكريبت Javascript

تعتبر الجافا سكريبت javascript أحد أكثر لغات البرمجة شيوعاً حول العالم، وستفيدك أكثر إذ كنت مطور ووردبريس أو تطبيقات اندرويد. فهي تعمل كلغة برمجه من طرف العميل لتطوير الواجهة الأمامية (Front-end JavaScript) ويتم استخدامها في كل موقع ويب تقريبًا على الإنترنت.

كما أن لغة جافا سكريبت تطورت كذلك لتصبح أيضًا لغة ترميز من جانب الخادم (Back-end Javascript) باستخدام Node.js مما يجعلها في منافسة مباشرة مع لغة PHP، وبالتالي سواء كنت مطور واجهة أمامية أم خلفية فإن تعلم جافا سكريبت سوف يفيدك بالتأكيد.

استخدام جافا سكريب لبرمجة صفحات الويب والبرمجة غرضية التوجه

عادة ما يتم اختصار جافا سكريبت javascript إلى JS، وتعرف باسم لغة البرمجة النصية لصفحات الويب scripting language for Web pages. كما تعمل لغة جافا سكريبت بنظام البرمجة الشيئية أو البرمجة غرضية التوجه object-oriented

البرمجة الشيئية أو الكائنية التوجه (Object-oriented programming)

هي التي تعرف اختصارًا بـOOP هي عبارة عن نمط متطور من البرمجة يعتمد على تعريف الكود بشكل كائنات.

يملك أي كائن خصائص (Properties) تعبر عن المتغيرات التي يتعامل معها و دوال (Functions) تعبر عن المهام التي يقوم بإنجازها على هذه المتغيرات. وتحكم هذه الكائنات عدة مبادئ أهمها مبدأ التغليف (Encapsulation) والوراثة (Inheritance)

التغليف Encapsulation:

هو تقييد عملية الوصول المباشر للبيانات أو المتغيرات المعرفة داخل الكائن، ويمكن الوصول لهذه البيانات من داخل الكائن نفسه فقط أو عن طريق مبدأ الوراثة أي عن طريق إنشاء كائن فرعي لهذا الكائن.

الوراثة Inheritance:

هي طريقة تمكنك من إنشاء كائن فرعي أو وريث من الكائن يرث منه صفات يتم تحديدها، فالكائن الفرعي يمكنه الوصول للمتغيرات الخاصة والمعرفة داخل الكائن الرئيسي ولا يمكن حدوث العكس. كما يحدث مع جميع الأكواد في أنها ترث كافة المتغيرات العامة global scope.

في البرمجة التقليدية كانت كافة العمليات أو الدوال المطلوبة تكتب في البرنامج من أعلى إلى أسفل وتنفذ وفق التسلسل الزمني لورودها من أول سطر حتى آخر سطر في البرنامج. بينما في البرمجة الشيئية OOP يقسم الكود إلى أشياء أو كائنات Objects. كل كائن يملك مجموعة من الخصائص أو المتغيرات والدوال الخاصة به.

علاقة الكائنات ببعضها البعض

مما يعني أن السكريبت يكون على شكل صناديق متعددة (كل كائن عبارة عن صندوق إن صح التعبير) تعمل وتتفاعل مع بعضها البعض لإنجاز المهام المطلوبة.

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

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

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

تعرف على ما الذي يمكن أن تفعله أيضا جافا سكريبت Javascript ؟

بشكل عام تستخدم جافا سكريبت للتحكم في سلوك صفحة الويب. على سبيل المثال:

إضافة عناصر ديناميكية متحركة: تبث الجافا سكريبت الحياة في صفحة الويب. بحيث يمكنك من خلالها مثلاً تحريك عنصر عند الوصول إليه، إظهار مربعات حوارية بعد وقت معين. أو تحريك النصوص، أو تبديل ألوان الموقع بحسب الوقت (مثل الوضع الليلي). أو عمل عدادات الوقت، أو عمل شرائح صورة متحركة، وغيرها الكثير..

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

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

هذه ليست قائمة كاملة بما يمكنك فعله بالجافا سكريبت. فلغة جافا سكريبت Javascript يمكنها حقًا أن تفعل أي شيء تتخيله في صفحة الويب وتتحكم في سلوك الصفحة بالكامل.

فيما يلي نسرد قائمة سريعة لتأثيرات يتم إنجازها بواسطة جافا سكريبت:

  • عمل القوائم المنسدلة مثل قائمة الموقع الرئيسية
  • عمل زر الصعود لأعلى الموقع بسرعة إذا كنت في نهاية الصفحة
  • إظهار رسائل للمستخدم في الوقت الفعلي استناداً لما يقوم به
  • تخزين نشاط المستخدم، وجلب بعض البيانات الخاصة به من المتصفح بهدف تطوير الموقع
  • تأمين حقول الإدخال بعدم السماح بكتابة رموز معينة، أو إجبار المستخدم على إدخال عدد معين من الحروف أو الكلمات
  • فتح الكاميرا والمايك ثم إرسالهم إلى شخص آخر عبر خاصية WEBRTC (عمل نظام دردشة بالصوت والصورة). كما يمكن أيضاً عمل تصوير لسطح المكتب بنفس التقنية
  • بناء المواقع عبر خاصيتي السحب والإفلات وهو ما نراه عند استخدام أداة مثل Elementor أو wb-bakery لبناء صفحات ووردبريس
  • حماية محتوى الموقع ضد النسخ مثل منع تحديد النصوص، منع استخدام زر الماوس الأيمن. منع استخدام أزرار النسخ من لوحة المفاتيح
  • إنشاء الألعاب على الويب
  • إنشاء الرسوم المتحركة ثنائية وثلاثية الأبعاد
  • جلب بيانات من مواقع أخرى عبر API مثل بيانات مستخدم من تويتر أو فيس بوك عبر نظام JSON و AJAX

ووردبريس والجافا سكريبت

كما يستخدم نظام الووردبريس لغة جافا سكريبت بشكل كبير جداً. حتى أنه يدعم أحد أهم مكتبات الجافا سكريبت وهي مكتبة الجي كويري (JQUERY) حيث يتضمن إصدار الووردبريس أحدث إصدار من JQUERY.

تعرف على جافا سكريبت Javascript

تعريف: JQUERY: هي مكتبة مفتوحة المصدر تسهل التعامل مع الجافا سكريبت. فهي تختصر أكواد جافا سكريبت بشكل كبير وتوفر على المبرمج الوقت والجهد كما أنها توفر تحميلًا أسرع للصفحات وتساعد في تحسين محركات البحث. لذا تستخدم على نطاق واسع من قبل مصممي الويب.

اقرأ أيضا …

اخطاء يقع فيها الكثير من المبرمجين المبتدئين التي قد تمنع تقدم مساره المهني وتحقيق أهدافه
الروابط الخارجية Nofollow links كل ما تريد معرفته عنها ، وأهميتها لـ SEO موقعك
كتابة ايموجى أو رموز بالكيبورد فقط بدون استخدام برامج – ASCII code – أكواد Alt+

admin

المشرف العام على موقع gaawy

View all posts by admin →