ما هو جافا سكريبت؟ الميزات وحالات الاستخدام والمزيد
نشرت: 2022-08-03لغة البرمجة النصية المستخدمة بشكل كبير على الويب تسمى JavaScript (JS). يتم دمجها بشكل متكرر في كود HTML وتستخدم لتحسين صفحات HTML. لغة مشروحة هي جافا سكريبت. وبالتالي ، لن تحتاج إلى تجميعها. تنتج JavaScript محتوى موقع الويب بطريقة ممتعة وتفاعلية. بحلول عام 2022 ، ستستخدم معظم مواقع الويب JavaScript من جانب المستخدم للتحكم في كيفية تصرف صفحات الويب ، باستخدام مكتبات الجهات الخارجية بشكل متكرر. يتوفر محرك JavaScript متخصص في كل مستعرض ويب رئيسي. يتم استخدامه لتنفيذ البرنامج على أدوات المستخدمين.
جدول المحتويات
ما هو جافا سكريبت؟
سيكون JavaScript عبارة عن تسلسل تعليمات عالي المستوى متوافق مع ECMAScript ، في كثير من الأحيان في الوقت المناسب فقط. لديها عمليات من الدرجة الأولى ، والقدرة البدنية القائمة على النموذج الأولي ، وتسليط الضوء على بناء الجملة. وهو يدعم لغات البرمجة التي تعتمد على الأحداث ، والتفاعلية ، ولغة البرمجة وهو متعدد النماذج. يقدم برنامج تطبيقي (APIs) لاستخدام نموذج كائن المستند ولغة الاستعلام والتواريخ وهياكل البيانات الشائعة (DOM).
لا توجد ميزات إدخال / إخراج (I / O) مثل الاتصال أو التخزين أو الإمكانات المرئية في مواصفات ECMAScript. في الواقع ، يتم تقديم واجهات برمجة تطبيقات JavaScript I / O بواسطة مستعرض الإنترنت أو أي نظام تشغيل آخر. توجد معالجات JavaScript في الأصل حصريًا في متصفحات الإنترنت ، وهي الآن جزء حيوي من مواقع ويب معينة ومجموعة واسعة من التطبيقات. Node.js هو النظام الأساسي لوقت التشغيل الأكثر استخدامًا لهذا التطبيق. على الرغم من وجود اسم متسق وقواعد نحوية ومكتبات موحدة لجافا وجافا سكريبت ، فإن اللغات المختلفة فريدة ولها تصميمات مختلفة تمامًا.
تعريف JavaScript في مستوى أعمق
من حين لآخر ، تقوم صفحة المستخدم بما هو أكثر من مجرد الجلوس وعرض التفاصيل الضرورية لتأخذها في الاعتبار - تقديم محتوى أفضل في الوقت المناسب وخرائط مفصلة ورسومات تفاعلية ثنائية وثلاثية الأبعاد وتمرير مربعات موسيقى الوسائط المتعددة وما إلى ذلك - يمكنك أراهن بالفعل أن JavaScript قد يكون متورطًا. سيكون JavaScript نظامًا أساسيًا للبرمجة النصية أو الترميز يسمح للمستخدمين بفرض هياكل متقدمة على صفحات الويب. ستكون الطبقة الثالثة من الكعك المكونة من تقنيات الويب الشائعة ، الأولان (HTML و CSS).
يجوز لنا تنسيق المواد المتوفرة عبر الإنترنت والتعليق عليها باستخدام HTML أو البرمجة النصية للنص التشعبي. على سبيل المثال ، يمكننا تحديد الفقرات والعناوين والجداول والمخططات ، بالإضافة إلى تضمين الصور ومقاطع الفيديو على الصفحة.
باستخدام CSS ، وهي مفردات القواعد والإرشادات ، يمكننا تصميم نص HTML بعدة طرق ، مثل اختيار الألوان والخطوط الأساسية وتنظيمها في أعمدة عديدة. تتيح لك لغة البرمجة عالية المستوى القيام بكل شيء تقريبًا ، بما في ذلك التحديث الديناميكي للمواد وإدارة الوسائط المتعددة وتحريك الرسومات. حسنًا ، ربما ليس شيئًا ، لكن من المدهش ما يمكن أن تفعله بضع كلمات من منشئ الشفرات.
جافا سكريبت من جانب العميل
من جانب العميل ، فإن أكثر أشكال البنية النحوية شيوعًا هي JavaScript. لكي يتعرف المتصفح على كود البرنامج النصي ، يجب أن يتم دمجه أو ربطه من مستند HTML.
وهذا يعني أن موقع الويب الجديد لا يجب أن يكون HTML ثابتًا ولكن قد يحتوي على برامج تتواصل مع المستخدمين ، وتدير المتصفحات ، وتقوم بإنشاء مستندات Html أثناء التنقل.
على مستوى البرامج النموذجية من جانب الخادم CGI ، تقدم طريقة JavaScript من جانب العميل العديد من الفوائد. يمكن استخدام JavaScript ، على سبيل المثال ، لتحديد ما إذا كان المستخدم قد قدم عنوان بريد إلكتروني جديدًا داخل حقل إدخال.
عندما يرسل العميل نموذجًا ، يتم تشغيل JavaScript ، وفقط إذا كانت جميع الإدخالات صحيحة ، يتم إرسالها إلى الخادم البعيد. يمكن استخدام JavaScript لاعتراض أنشطة المستخدم التي يتم البدء فيها عن قصد أو ضمنيًا ، مثل الأزرار الانضغاطية وحركة الارتباط التشعبي والأحداث الأخرى.
ما هو استخدام جافا سكريبت؟
1. تطوير الويب
يتم إنشاء صفحات الويب باستخدام لغة برمجة العميل المعروفة باسم JavaScript. أنشأته Netscape كبرمجة قائمة بذاتها. يتم استخدامه لتوفير قدرات مميزة لصفحات مثل التدوير ، والطرح ، والعديد من أشكال المرئيات عندما يكون موقع الويب يجب أن يكون ديناميكيًا. تستخدمه جميع مواقع الويب بشكل أساسي لأغراض التحقق من الصحة. إنه يمكّن البرامج الخارجية مثل مستندات Word ، والأزرار التي يتم تشغيلها ، ودعم تطبيقات Flash ، وما إلى ذلك ، فيما يتعلق بعمليات التحقق. عندما يطلبها المستخدم ، يمكنه أيضًا تحميل مادة في صفحة دون تحديثها.
2. تطبيقات الويب
نظرًا لأن أجهزة الكمبيوتر الشخصية وتطبيقات سطح المكتب قد تقدمت تقنيًا ، أصبحت اللغة ضرورية الآن لبناء تطبيقات موثوقة عبر الإنترنت. يتعين على المستخدم فقط النقر فوق المؤشر وسحبه للتنقل عبر الكرة الأرضية في خرائط Google. يمكن الوصول إلى جميع العروض الإضافية بنقرة واحدة. بفضل JavaScript ، هذا ممكن. يتعامل مع المستخدم دون الاتصال بأجهزة الكمبيوتر ذهابًا وإيابًا. يستخدم JavaScript لغات البرمجة (APIs) لمنح الكود إمكانيات إضافية.
3. العروض التقديمية
يوفر JavaScript القدرة على إنشاء عروض تقديمية مثل مواقع الويب أيضًا. لإنشاء عرض شرائح على شبكة الإنترنت ، تقدم JavaScript RevealJS وحزم مخصصة. يستخدم Reveal.js HTML لإنتاج العديد من العروض التقديمية الأكثر روعة وجاذبية. من السهل وضع الشرائح المتداخلة للمستخدم. مع الكثير من المساعدة عبر الإنترنت ، يمكن لأي شخص تصميم موقع ويب بدون خبرة في البرمجة. تم تحسين عروض الشرائح هذه باللمس وتعمل بشكل جيد على الأجهزة اللوحية والهواتف الذكية والأجهزة المحمولة الأخرى.
بالإضافة إلى ذلك ، توفر JavaScript العديد من الخلفيات للشرائح وأنماط التغيير والأنماط. جميع صيغ ألوان CSS مدعومة. بالإضافة إلى ذلك ، توفر JavaScript للمكوِّن الإضافي Bespoke.js مجموعة كبيرة من الوظائف. تتكون هذه من قوائم ديناميكية ذات تعداد نقطي ، وقياس سريع الاستجابة ، وتسطير بناء الجملة لعينات التعليمات البرمجية. إنه يقدم موضوعات لذيذة ومقلصة. يعد استخدام مولد لتشغيل Bespoke.js هو الخيار الأسرع. يمكن للمستخدم إضافة عناوين لعروضه التقديمية والإجابة على سلسلة من الأسئلة للحصول على المكونات الإضافية اللازمة.
4. تطبيقات الخادم
بمساعدة خادم ، تستخدم Node JS تطبيقات صغيرة وفعالة تعتمد على الأحداث منتشرة في جميع أنحاء الأنظمة. قد تتم كتابة الوظيفة بلغة JavaScript فقط على العميل أثناء قيام المستخدم بإنشاء تطبيقات معقدة من جانب العميل في JavaScript بحيث تكون الترجمات الذهنية بين اللغتين ممكنة.
5. خوادم الويب
يمكن إنشاء خادم الويب باستخدام Node JS. تتمتع Node JS بميزة كونها مدفوعة بالأحداث ولا تنتظر نتيجة مكالمة مسبقة. يتحول إلى المكالمة اللاحقة أثناء استخدام الأحداث للحصول على تنبيهات عند تلقي جزء من المعلومات للمكالمة السابقة. الخوادم المستندة إلى Node JS سريعة للغاية ولا تتطلب تخزينًا مؤقتًا وتنقل البيانات في أجزاء.
بالإضافة إلى ذلك ، فإنه يستخدم حلقة حدث ذات ترابط واحد وغير قابلة للحظر. يمكن استخدام وظيفة createServer () لحزمة HTTP للمساعدة في إنشاء الخادم. في كل مرة يراقب فيها شخص ما المنفذ 8080 بشكل مستمر ، يتم تشغيل هذا الإجراء. في المقابل ، يحتاج خادم HTTP إلى إخراج HTML وإضافته إلى طلب HTTP. يمكن تثبيته بسرعة عن طريق إدخال "npm install -g HTTP-server" ، ويمكن تشغيله عن طريق تشغيل العملية "HTTP-server".
6. الألعاب
بالإضافة إلى صفحات الويب ، يمكن أيضًا صنع الألعاب باستخدام JavaScript. تعود شعبية JavaScript في تطوير الألعاب إلى تكاملها مع HTML5. يوفر مكتبة Ease JS ، التي تقدم طرقًا مباشرة للتفاعل مع الصور الغنية. كما أنه يوفر واجهة برمجة تطبيقات بقائمة عروض منظمة معروفة لجميع مطوري الفلاش. ستعمل المرحلة التي ينشئها المستخدم على تسليم قائمة العرض إلى اللوحة القماشية المقصودة. بالإضافة إلى ذلك ، يحتوي Ease JS على صور نقطية ثنائية الأبعاد تُعرف باسم Sprites يتم عرضها على الفور لإنتاج وجهة التعديلات.
7. الفن
أصبح الآن من الأسهل إنشاء صور على موقع ويب باستخدام HTML5 و JavaScript. جعلت القدرة على إنشاء أي شكل ثنائي أو متعدد على قماش من المتصفح نظامًا أساسيًا جديدًا تمامًا لجميع أنواع المساعي الفنية الرقمية. نظرًا لأن اللوحة القماشية ليس لها حدود ولا مضمون ، يمكن لأي شخص استخدامها لصنع الفن.
8. تطبيقات Smartwatch
Javascript هي اللغة الأكثر استخدامًا لأنه يمكن استخدامها في أي جهاز أو تطبيق. تستخدم تطبيقات الساعات الذكية تطبيقًا يسمى Pebble JS ، والذي يتم توفيره بواسطة JavaScript Uses. بالنسبة للتطبيقات التي تحتاج إلى الإنترنت لتعمل ، فإن هذا الإطار فعال. قد يستخدم المطور Pebbles لإنشاء تطبيقات JavaScript لساعات مختلفة.
9. تطبيقات للجوال
يعد إنشاء تطبيقات بدون إعدادات الويب أهم مهمة يمكن إنجازها باستخدام JavaScript. نظرًا لسيطرة Apple و Android على سوق الأجهزة المحمولة ، يتم استخدام لغتين مختلفتين من لغات البرمجة لإنشاء هذه الأجهزة. يجب أن تكون الكتابة مرة واحدة واستخدامها على كلا النظامين أمرًا ممكنًا.
الإطار الذي يجعل هذا ممكنًا هو PhoneGap. توفر React Native ، التي تم تطويرها للتو ، هذه الوظيفة. إنه المساهم الرئيسي في التحديثات والتطبيقات عبر الأنظمة الأساسية. لذلك يمكن استخدام جافا سكريبت للحصول على البرامج المناسبة ونشرها عبر سياقات مختلفة.
جافا سكريبت المتقدمة: الأطر والمكتبات (أدوات AKA لجعل JS أسهل)
عند العمل باستخدام JavaScript ، ستكتشف أن بعض ميزات ووظائف JS ، مثل انتقالات القوائم والتلاشي ، ونماذج نقل الملفات ، ومعارض الصور ، تظهر بشكل متكرر على العديد من مواقع الويب والتطبيقات عبر الإنترنت. حتى لو كان بإمكانك إنشاء كل عنصر من هذه العناصر من البداية متى احتجت إلى واحد ، فإن استخدام أطر عمل البرمجة مثل jQuery سيجعل حياتك كمبرمج أبسط بكثير.
مسج
يمكن لإرشادات jQuery أحادية السطر تنفيذ عمليات تشفير JavaScript المضمنة في مكتبة jQuery. إذا تم استخدام كود jQuery في مكانه ، فسيظهر نموذج كود JavaScript من قبل كما يلي:
<script> $(“#submit”).click(function () { var greeting = $(“#name”).val(); $("#headline").html("Thank you for joining our email list," + greeting); return false; }); <script/>
كما رأيت ، فإن أسلوب تشفير jQuery أكثر إيجازًا. يمكن استخدامه عندما ترغب في ترميز موقع ويب وتطبيق عبر الإنترنت وتحتاج إلى تنفيذ نفس وظيفة JavaScript.
يمكن دمج كود JQuery لإنشاء مكونات إضافية أكثر تعقيدًا بالإضافة إلى مثيلات مثل المذكورة أعلاه ، والتي يشار إليها باسم مقتطفات jQuery من التعليمات البرمجية التي تم حقنها مباشرة من إطار عمل jQuery لتنفيذ أغراض معينة. يمكن الوصول المباشر إلى ملحقات jQuery من خلال مكتبة رسومات jQuery (واجهة المستخدم) ، حيث يمكن نسخ البيانات الأصلية ولصقها.
ReactJS
سيكون ReactJS إطار عمل جافا سكريبت أساسيًا آخر لمطوري الويب ، بما في ذلك jQuery. أنشأ Facebook React JS في عام 2011 كأداة JavaScript في الجانب الأمامي تركز على تطوير واجهة المستخدم (واجهات المستخدم). إذا كنت غير مألوف ، فإن واجهات المستخدم (UIs) هي مجموعة متنوعة من اللوحات التي تظهر على الشاشة ، وأشرطة البحث ، والرموز ، وكل شيء آخر يتعامل معه المستخدم للاستفادة من تطبيق تابع لجهة خارجية.
تعمل React على تحسين الأداء العام للموقع والموثوقية بمفهوم يسمى Virtual DOM وتمكن المطورين من الاستفادة من التعليمات البرمجية المكتوبة مسبقًا لتكرار عناصر القائمة ، بما في ذلك الميزات المصممة للتقييم وإمكانيات التخصيص وانتقالات اللوحة المتلاشية أو الخارجة ، إلخ.
ميزات JavaScript
تحتوي JavaScript على العديد من الصفات المميزة التي تؤدي إلى اعتمادها على نطاق واسع. Javascript هي لغة مفيدة للغاية للتعلم لأنها تستخدم الآن غالبًا على مواقع الويب. أفضل شيء في Javascript هو أنه لا يلزم معرفة سابقة بالبرمجة.
ميزات JavaScript العامة
تحتوي لغة JavaScript على قائمة بالوظائف. فيما يلي بعض ميزات JavaScript الشائعة:
1. التحقق من صحة إدخال المستخدم
عند استخدام النماذج ، فإن JavaScript مفيدة حقًا. يمكنه تسريع العمليات عن طريق التحقق من صحة الإدخال بحثًا عن الأخطاء. قبل إرسال المعلومات إلى الكمبيوتر ، تقوم JavaScript بفحص ما إذا كان المستخدم قد ترك حقلاً إجباريًا غير مملوء أو أن البيانات خاطئة.
2. حسابات سهلة من جانب العميل
يمكن لـ JavaScript إجراء عمليات حسابية بسيطة على المتصفح لأنه برنامج من جانب العميل. لكل وظيفة ، لا يرغب العميل في طلب انتباه الخادم. عندما يريد المستخدم إجراء هذه الحسابات بشكل متكرر ، فهذا مفيد للغاية. في العديد من السيناريوهات ، قد يستغرق إنشاء اتصال قاعدة البيانات وقتًا أطول بكثير من تنفيذ الحسابات نفسها.
3. المزيد من السلطة
بدلاً من الاعتماد على خوادم الويب ، تمنح JavaScript للمتصفح مزيدًا من الاستقلالية. تقدم JavaScript للعديد من المتصفحات المزيد من الميزات التي تساعد في تقليل حركة مرور الشبكة وإجهاد الخادم.
4. منصة غير مرتبطة
نظرًا لأن المتصفحات تفسر JavaScript ، فإنها تقضي على مشكلات التشغيل البيني والتطوير. لذلك يمكن استخدامه على الأنظمة الأساسية التي تدعم Netscape ، بما في ذلك Windows و Macintosh وغيرها. بالإضافة إلى ذلك ، قد يتم تضمينها في بعض البرامج النصية الأخرى التي تستخدم JavaScript ، مثل HTML.
5. التعامل مع التواريخ والوقت
جافا سكريبت ، على عكس لغات البرمجة النصية الأخرى ، تأتي مع طرق مضمنة لحساب الموقع / المكان. نتيجة لذلك ، فإن البرمجة باستخدام هذه التقنيات بسيطة للغاية. getDate ().
6. إنتاج محتوى HTML
تقدم JavaScript العديد من الميزات المفيدة للغاية لإنشاء محتوى عبر الإنترنت برمجيًا. بعد الحدث ، يمكننا إضافة محتوى وروابط وصور وجداول وما إلى ذلك.
7. تحديد نظام التشغيل والمستعرض للمستخدم
جافا سكريبت بارع جدًا في تحديد نظام التشغيل والمتصفح الخاص بالشخص. على الرغم من أن JavaScript يعمل على جميع الأنظمة الأساسية ، فقد تكون هناك حالات نحتاج فيها إلى متصفح المستخدم للمعالجة. قد يكون هذا مفيدًا عند تطوير التعليمات البرمجية التي تولد مخرجات متنوعة في متصفحات مختلفة.
ميزات JavaScript الحديثة
دعونا نلقي نظرة على بعض الإضافات الحديثة لجافا سكريبت. يمكننا أن نرى ما يميزه عن لغات البرمجة النصية الأخرى. بعد بعض الميزات الأساسية ، تم إنشاء العديد من الخصائص المعاصرة لجافا سكريبت. فيما يلي عدد قليل منهم:
1. اسمحوا / const
تمت إضافة المؤهلات "let" و "const" ، الجاهزة لاستبدال "var" ، بواسطة JavaScript. إنهم يختلفون عن "var" في ذلك معًا. يمكننا استخدامها حصريًا داخل الكتلة التي تم تعريفها فيها ، مما يجعلها أكثر أهمية مقارنة بـ "var" ، والتي يمكن الوصول إليها خارج البرنامج حتى بعد التهيئة.
2. وظائف السهم
يمكن تقليل بناء الجملة وعدد أكواد البرامج الخاصة بأداء موقع الويب بشكل كبير باستخدام هذه الطرق. يمكن استخدامها بسهولة في JavaScript بشكل مجهول بسبب تركيبها البسيط.
3. النموذج الحرفي
توفر لغات البرمجة النصية الأخرى بشكل متكرر ميزة تتيح لك تخزين المتغيرات في سلاسل. إن القدرة على التركيز بشكل أكبر على إنشاء البرنامج بدلاً من قضاء وقت ممتع في بناء الجملة تجعل هذه الأداة قيمة للمبرمجين.
4. وظائف صفيف جديدة
على الرغم من أنها ليست مطلوبة لأي لغة كمبيوتر ، إلا أن وظائف المصفوفة تجعل الأمور أسهل للمطور. بالإضافة إلى ذلك ، تصبح الشفرة أكثر إيجازًا ومفهومة نتيجة لذلك. يدعم JavaScript كلاً من المصفوفة القياسية والمصفوفة العشوائية. يمكن أن تكون مؤشرات المصفوفة غير المتماثلة سلاسل ، لكن يجب أن تكون فهارس المصفوفة التقليدية ثوابت موجبة.
5. الإعدادات الافتراضية
تمنع ميزة JavaScript هذه كسر الشفرة بالكامل بسبب خطأ إملائي واحد. عندما يتعين على المبرمج التحقق من أن الوظيفة تعمل دون أي حجج ، فهذا مفيد للغاية.
6. اختزال الملكية
استخدام التقنيات المدمجة مثل. get () مفتوح للمبرمجين. تقلل هذه التقنيات من عدد سطور التعليمات البرمجية المكتوبة وتمنع التطبيق المتكرر لنفس الكود. هذه الآليات الفطرية مفيدة جدًا في تقليل الوقت وتكلفة التطوير.
إذن ما الذي يمكن أن تفعله؟
تسمح لك بنيات البرمجة الأساسية للغة JavaScript من جانب العميل بتنفيذ أشياء مثل:
ضع المعلومات المفيدة في المتغيرات. والكثير!
ومع ذلك ، فإن القدرات القائمة على لغة البرمجة من جانب العميل تكون أكثر إثارة للاهتمام. لتوظيفها في كود JavaScript الخاص بك ، فإن ما يسمى بالواجهات مفتوحة المصدر (APIs) يتيح لك الوصول إلى قوى خارقة إضافية.
واجهات برمجة التطبيقات عبارة عن مجموعات مُنشأة مسبقًا من مكونات الترميز التي تمكن المطورين من إنشاء تطبيقات قد تكون صعبة أو مستحيلة الإنشاء. إنها تعمل بشكل مشابه لمجموعات الأثاث الجاهزة في بناء المنزل من حيث الترميز.
1. متصفح APIs
يحتوي متصفح الويب الخاص بك على واجهات برمجة تطبيقات مدمجة قد تقوم بمهام معقدة مفيدة أو تكشف عن بيانات من نظام الكمبيوتر الأساسي.
2. واجهات برمجة تطبيقات الطرف الثالث
في معظم الأوقات ، يجب أن تحصل على التعليمات البرمجية والبيانات الوصفية لواجهات برمجة التطبيقات التابعة لجهات خارجية من الإنترنت لأنها غير مدرجة في المتصفح افتراضيًا.
3. يمكن لـ JavaScript تغيير محتوى HTML
getElementById هي إحدى طرق JavaScript HTML العديدة ().
يحول هذا المثال لغة HTML الداخلية للعنصر إلى "Hello JavaScript" باستخدام التقنية "لتحديد موقع" رمز Html مع السمة id = "demo":
مثال
document.getElementById("demo").innerHTML = "Hello JavaScript";
4. يمكن لـ JavaScript تغيير قيم سمات HTML
يمكن تعديل قيم سمات HTML باستخدام JavaScript. على سبيل المثال ، يعدل JavaScript قيمة خاصية src (المصدر) للصورة.
5. يمكن لـ JavaScript تغيير أنماط HTML (CSS)
أحد أشكال تعديل خاصية HTML هو تعديل مظهر عنصر HTML:
مثال
document.getElementById("demo").style.font size = "35px";
أو
document.getElementById('demo').style.font size = '35px';
document.getElementById ('demo'). style.font size = '35px'؛
6. يمكن لـ JavaScript إخفاء عناصر HTML
يمكن تغيير نمط الشاشة لإخفاء عناصر HTML:
مثال
document.getElementById("demo").style.display = "none";
أو
document.getElementById('demo').style.display = 'none';
7. يمكن لـ JavaScript إظهار عناصر HTML
يعد تعديل نمط العرض طريقة أخرى لإظهار مكونات HTML المخفية:
مثال
document.getElementById("demo").style.display = "block";
أو
document.getElementById('demo').style.display = 'block';
تحويل فكرة التطبيق الخاص بك إلى واقع
دعونا نبني تطبيقًا جديدًا معًا
أنواع بيانات JavaScript
تحتوي جميع لغات البرمجة النصية على هياكل بيانات مضمنة. ومع ذلك ، فهي تختلف في كثير من الأحيان بين اللغات. تقدم JavaScript أنواع بيانات مضمنة ، ويتم سرد وصف لميزاتها في هذا القسم. يمكن إنشاء أنواع البيانات الأخرى باستخدام هذه. يتم إجراء العلاقات مع النصوص الأخرى كلما كان ذلك ممكنًا.
1. القيم البدائية
تحدد جميع الأنواع القيم الثابتة (أي غير القابلة للتغيير) ، باستثناء الكائنات. السلاسل ، على سبيل المثال ، غير قابلة للتغيير. يشار إلى القيم من هذا النوع باسم "القيم الأولية".
2. نوع منطقي
تصف التعبيرات المنطقية الكيانات المنطقية ولها نتيجتان محتملتان: صواب وخطأ.
3. نوع فارغ
نوع بيانات فريد آخر هو هذا النوع الذي يحتوي فقط على قيمة فارغة كقيمة محتملة. تشير القيمة الفارغة إلى عدم وجود قيمة. إنها ليست مثل سلسلة فارغة ("") أو 0 ؛ إنه لا شيء. يمكن إزالة المحتويات الحالية بشكل صريح من خلال إعطاء قيمة فارغة لمتغير.
4. نوع غير محدد
القيمة الفريدة غير المعرفة هي القيمة الوحيدة الممكنة لنوع البيانات غير المحدد. يكون معنى المتغير غير محدد إذا تم تعريفه ولكن لم يتم إعطاء قيمة له.
5. نوع الرقم
الأعداد الصحيحة المعبر عنها بالتدوين اللوغاريتمي ، مثل القيم التالية أو القيم الموجبة أو السلبية مع أو بدون قيمة عددية ، يتم تمثيلها بنوع بيانات العدد الصحيح ، على سبيل المثال ، 1.5e-4
6. نوع BigInt
في JavaScript ، سيكون نوع BigInt رقمًا أساسيًا قد يمثل الأرقام بأي درجة من الدقة. حتى بعد تحديد العدد الصحيح الآمن لـ Numbers ، يمكنك تخزين أعداد ضخمة والعمل بأمان باستخدام BigInts.
7. نوع السلسلة
يمكن تمثيل البيانات النصية بنوع بيانات السلسلة (أي تسلسل الأحرف). يتم إنشاء السلاسل من خلال تضمين حرف واحد أو أكثر في اقتباسات مفردة أو مزدوجة.
8. نوع الرمز
يمكن استخدام الرمز كمفتاح لسمة الكائن لأنه قيمة بدائية مميزة وغير قابلة للتغيير (انظر أدناه). يشار إلى الرمز باسم "الذرة" في بعض لغات الكمبيوتر.
9. الأشياء (مجموعات الخصائص)
سيكون الكائن نوع بيانات معقدًا يتيح تخزين مجموعات البيانات. الكائن له سمات ، والتي توصف بأنها أزواج مفتاح-قيمة. بينما يمكن أن تكون قيمة الخاصية أي متغير فئوي ، بما في ذلك السلاسل أو الأعداد الصحيحة أو القيم المنطقية أو أنواع البيانات المعقدة مثل المصفوفات والوظائف والكائنات الأخرى ، فإن المفتاح المتغير (العنوان) غالبًا ما يكون سلسلة. في الفصول التالية ، ستحصل على معلومات إضافية حول العناصر.
الأدوات والموارد
1. أدوات مطوري Firefox
يأتي Firefox مع مجموعة من أدوات مطوري الويب تسمى Firefox Developer Tools. يمكن استخدامها لفحص وتعديل وتصحيح أخطاء JavaScript و CSS و HTML. باختيار أدوات> مطور الويب> أدوات مطور الويب من القائمة ، يمكنك الوصول إلى أدوات مطوري Firefox.
2. وحدة تحكم الويب
يسجل البيانات المتعلقة بصفحة الويب ، بما في ذلك الطلبات الإضافية ، و JavaScript ، و CSS ، ومخاوف الخصوصية ، والتحذيرات ، والرسائل الإعلامية التي يتم تسجيلها على وجه التحديد بواسطة كود JavaScript الذي يتم تشغيله في سياق الصفحة. يسمح لك بالعمل على عبارات JavaScript داخل إطار عمل صفحة موقع ويب للتفاعل معها.
3. جافا سكريبت منشئ ملفات التعريف
أداة مهمة لفهم الكود الخاص بك بشكل أفضل هي أداة تعريف JS ، والتي يمكنها تحديد وتحديد وتحسين أوجه القصور في التعليمات البرمجية الخاصة بك. نظرًا لأنك معتاد على واجهة المستخدم ، فهي سهلة الاستخدام ، ومن المحتمل أن يكون لديك بالفعل واحدة مثبتة في متصفحك.
4. المصحح
يمكنك التنقل حول كود JavaScript ودراسة حالته أو تغييرها باستخدام JavaScript Debugger للمساعدة في العثور على المشكلات. يمكن استخدامه لتصحيح أخطاء التعليمات البرمجية التي يتم تنفيذها عن بُعد ، مثل جهاز Android الذي يقوم بتشغيل Firefox لنظام Android أو عن بُعد في Firefox. لمعرفة كيفية ربط مصحح الأخطاء بهدف بعيد ، انتقل إلى البرمجة.
5. قذائف JavaScript
يمكنك اختبار أجزاء تعليمات JavaScript البرمجية بسهولة باستخدام غلاف JavaScript دون الحاجة إلى تحديث موقع الويب. إنها مفيدة حقًا في كتابة التعليمات البرمجية وإصلاحها.
6. تعلم JavaScript
تعلم أساسيات JavaScript المعاصرة (ES2015 +) ، ثم تدرب في بيئة طبيعية. للتأكد من أنك تتعلم تدريجياً معايير الصناعة ، فإن التحديات تستند إلى مشاريع فعلية.
7. معا JS
توفر مكتبة Mozilla TogetherJS JavaScript إمكانات ووظائف تعاونية لموقع الويب الخاص بك مجانًا. قد يساعد مستخدموك بعضهم البعض على الفور على موقع الويب الخاص بك عن طريق إضافة TogetherJS إليه!
8. StackOverflow
قد يطرح المبرمجون أسئلة ويجدون إجابات على موقع Stack Overflow. إنه بمثابة الموقع الرئيسي لشبكة Stack Exchange Network. قام جويل سبولسكي وجيف أتوود بتطويره في عام 2008. ويقدم إجابات على الأسئلة حول العديد من الموضوعات المختلفة المتعلقة ببرمجة الكمبيوتر.
9. JSFiddle
لتحليل وعرض نماذج تعليمات HTML و CSS و JavaScript من صنع المستخدم وتعاونية ، والتي يشار إليها أحيانًا باسم "fiddles" ، فإن JSFiddle هي خدمة ومجتمع IDE رقمي. يمكنك تقليد مكالمات AJAX باستخدامه.
10. JSBin
تم إنشاء تطبيق عبر الإنترنت يسمى JS Bin بشكل أساسي لمساعدة مطوري JavaScript و CSS في اختبار أجزاء التعليمات البرمجية وتصحيحها في السياق. يمكنك اختبار وتحرير HTML و JavaScript باستخدام JS Bin.
11. Codepen
لمحترفي تصميم الواجهة الأمامية ، هناك بيئة تطوير مجتمعية تسمى CodePen. قم بإنشاء ونشر موقع على شبكة الإنترنت ، وعرض إنجازاتك ، وإنشاء حالات اختبار للتعلم وتصحيح الأخطاء ، والحصول على الإلهام.
12. StackBlitz
بمساعدة StackBlitz IDE عبر الإنترنت ، يمكنك بسهولة وبشكل متكرر إنشاء تطبيقات Angular و React و Vue في متصفحك. يتم التعامل مع تثبيت التبعية ، والتجميع ، والتعبئة ، والتحديث الساخن عند الدخول ، وغير ذلك الكثير تلقائيًا.
13. RunJS
تمنحك عمليات التشغيل وصولاً كاملاً إلى DOM والوصول إلى واجهات برمجة تطبيقات Node and Browser. يتيح لك ذلك درجة من القدرة على التكيف وهو أمر مستحيل باستخدام وحدة تحكم Chrome أو REPL عادية.
14. مايكروسوفت فرونت بيج
أنشأت Microsoft برنامج FrontPage ، وهو محرر HTML محبوب. قد يقوم مصممو الويب بإنشاء مواقع ويب ديناميكية بمساعدة قدرات JavaScript التي يوفرها FrontPage.
15. برنامج Macromedia Dreamweaver MX
Macromedia Dreamweaver MX هي أداة HTML و JavaScript محبوبة للغاية بين خبراء تطوير الويب. يقدم العديد من مكونات JavaScript المبنية مسبقًا ، ويعمل بشكل جيد مع قواعد البيانات ، ويتوافق مع المعايير الناشئة مثل XHTML و XML.
16. Macromedia HomeSite 5
يمكن استخدام مطور HTML و JavaScript شائع من Macromedia يسمى HomeSite 5 للحفاظ على صفحات الويب الشخصية بكفاءة.
كيف تضيف JavaScript إلى صفحتك؟
على غرار كيفية نشر CSS في صفحة HTML الخاصة بك ، فإن JavaScript أيضًا. بينما تستخدم CSS عناصر <link> لتطبيق أوراق الأنماط الخارجية وعناصر <style> لتطبيق أوراق الأنماط الداخلية على HTML ، فإن JavaScript يحتاج فقط إلى صديق واحد في عالم HTML - عنصر <script>. دعنا نكتشف كيف يعمل هذا.
جافا سكريبت داخلي
1. اصنع نسخة محلية من الملف application-javascript.html من مثالنا أولاً. يرجى وضعها في مكان منطقي ودليل.
2. افتح الملف في كل من محرر النصوص ومتصفح الويب. سترى أن HTML ينتج صفحة ويب مباشرة مع زر قابل للنقر.
3. بعد ذلك ، افتح محرر النصوص وأدخل ما يلي عقليًا قبل علامة الإغلاق </head>:
<script> // JavaScript goes here </script>
4. لجعل الصفحة تقوم بعمل أكثر إثارة للاهتمام ، سنقوم الآن بتضمين بعض JavaScript في عنصر <script> الخاص بنا.
5. عند الضغط على الرابط ، يجب أن تظهر فقرة جديدة أسفلها عند حفظ المستند وتحديث المتصفح.
جافا سكريبت خارجي
1. هذا الأسلوب ممتاز ، ولكن ماذا لو احتجنا إلى حفظ JavaScript في ملف منفصل؟ الآن دعنا نتحرى هذا.
2. أولاً ، قم بإنشاء مجلد جديد في نفس المجلد مثل ملف HTML الخاص بك. أطلق عليه اسم script.js ، وتأكد من أن اسم الملف ينتهي بـ in.js حتى يمكن التعرف على JavaScript.
3. استبدل عنصر <script> الحالي بما يلي:
<script src="script.js" defer></script>
4. داخل script.js ، أضف النص التالي:
function createParagraph() { const para = document.createElement('p'); para.textContent = 'You clicked the button!'; document.body.appendChild(para); } const buttons = document.querySelectorAll('button'); for (const button of buttons) { button.addEventListener('click', create paragraph); }
5. يجب أن ترى نفس الشيء إذا قمت بحفظ المتصفح وإعادة تشغيله. على الرغم من أن لدينا الآن JavaScript في ملف خارجي ، إلا أنه لا يزال يعمل بالمثل. عادةً ما يكون هذا جيدًا من حيث ترتيب التعليمات البرمجية الخاصة بك وجعلها قابلة لإعادة الاستخدام عبر ملفات HTML الأخرى. علاوة على ذلك ، بدون كميات هائلة من النصوص التي يتم سكبها فيها ، يكون فهم HTML أسهل.
معالجات جافا سكريبت المضمنة
اعلم أنك ستجد أحيانًا شفرة JavaScript فعلية موجودة داخل HTML. قد يشبه المظهر هذا:
function createParagraph() { const para = document.createElement('p'); para.textContent = 'You clicked the button!'; document.body.appendChild(para); } <button>Click me!</button>
باستثناء معالج onclick المضمن الخاص بالعنصر <button> ، والذي يتسبب في تشغيل الوظيفة عند النقر فوق الزر ، فإن هذه العينة لها نفس الوظيفة تمامًا مثل الجزأين السابقين.
باستخدام addEventListener بدلاً من ذلك
استخدم بنية JavaScript نقية بدلاً من دمج JavaScript في HTML الخاص بك. يمكنك اختيار كل زر على موقع ويب باستخدام طريقة querySelectorAll (). باستخدام addEventListener ، يمكنك تكرار الأزرار وإعطاء كل منها معالجًا (). إذن هذا هو رمز ذلك:
const buttons = document.querySelectorAll('button'); for (const button of buttons) { button.addEventListener('click', create paragraph); }
على الرغم من أنها قد تكون أوسع قليلاً من خاصية onclick ، إلا أنها ستعمل مع جميع الأزرار ، بغض النظر عن مقدارها على الصفحة ، أو إضافتها ، أو حذفها. ليست هناك حاجة لتعديل JavaScript.
استراتيجيات تحميل البرنامج النصي
إن تشغيل البرامج في الوقت المناسب أمر محفوف بالمشاكل. ليس هناك ما هو سهل كما يبدو! حقيقة أن الصفحة تقوم بتحميل HTML الخاص بها بالترتيب الذي تظهر به هي مشكلة شائعة. لن يعمل البرنامج النصي الخاص بك إذا تم جلب JavaScript ومعالجته قبل HTML الذي كنت تحاول تعديله في حال كنت تستخدم JavaScript لتغيير المكونات على الصفحة (أو بشكل أكثر دقة ، نموذج كائن المستند).
في الشفرة المذكورة سابقًا ، يتم استيراد JavaScript وتنفيذها في رأس المستند حتى قبل معالجة نص HTML لكل من المثيلات المحلية والعالمية. لقد استخدمنا بعض الإنشاءات للتغلب على هذا لأنه قد يؤدي إلى حدوث خطأ.
ماذا تفعل Java Script على صفحتك؟
من خلال واجهة برمجة تطبيقات نموذج كائن المستند ، يتم استخدام JavaScript بشكل متكرر لتحرير HTML و CSS ديناميكيًا لتحديث تجربة المستخدم (كما هو مذكور أعلاه). تذكر أن شفرة صفحات الويب الخاصة بك يتم تحميلها وتشغيلها عادةً بالتسلسل الذي يحدث على الصفحة. إذا تم استيراد JavaScript وتنفيذها قبل HTML و CSS التي من المفترض تغييرها ، فقد تحدث أخطاء. في جزء من تكتيكات تحميل النص لاحقًا في النص ، سوف تكتشف كيفية الالتفاف على ذلك.
أمن المتصفح
من الناحية الفنية ، كل علامة تبويب على الويب لها "بيئة تنفيذ" خاصة بها لتشغيل التعليمات البرمجية. نتيجة لذلك ، يتم تنفيذ رمز كل علامة تبويب بشكل مستقل عن الرموز الأخرى. لا يمكن أن يؤثر على رمز علامة تبويب أخرى أو موقع ويب مختلف. هذا إجراء احترازي أمني ذكي لأنه إذا لم يكن كذلك ، فقد يبدأ المتسللون في إنشاء كود لسرقة البيانات من الخدمات الأخرى والقيام بأشياء ضارة أخرى.
ترتيب تشغيل JavaScript
عند مصادفة كتلة جافا سكريبت ، يقوم المتصفح عادةً بتنفيذها من أعلى إلى أسفل بالتسلسل. هذا يعني أن التسلسل الذي ترتب به الأشياء يجب أن يكون حذرًا. سيتوقف عن العمل إذا تم تبديل أول لغتي برمجة ؛ بدلاً من ذلك ، سيتم إرجاع خطأ TypeError: para هو خطأ غير معروف في وحدة تحكم مطور الويب. نتيجة لذلك ، لا يمكننا إضافة مراقب حدث إلى كائن الفقرة لأنه غير موجود بعد.
تفسير التعليمات البرمجية المترجمة مقابل الشفرة
يمكن استخدام الكلمتين "المترجمة" و "المترجمة" فيما يتعلق بالبرمجة. في لغة البرمجة ، يتم تنفيذ الكود من أعلى إلى أسفل ، ويتم إرجاع الإخراج على الفور. لا يلزم تغيير الكود قبل أن يتم تنفيذه بواسطة المتصفح. يتم إرسال الرمز بتنسيق نصي يسهل على المبرمجين معالجته.
على الجانب الآخر ، يتم تغيير (تجميع) اللغات المترجمة قبل استخدامها بواسطة الكمبيوتر. على سبيل المثال ، يتم تحويل C / C ++ إلى رمز الجهاز ، والذي يقوم الكمبيوتر بتنفيذه. يستخدم البرنامج ملفًا ثنائيًا تم إنتاجه من التعليمات البرمجية المصدر للتطبيق.
جانب الخادم مقابل التعليمات البرمجية من جانب العميل
في حالة تطوير الويب ، يمكن أيضًا استخدام الكلمتين الكودتين من جانب الخادم والرمز من جانب العميل. عندما تتم زيارة صفحة ويب ، يتم تنزيل التعليمات البرمجية من جانب العميل لهذه الصفحة وتشغيلها وعرضها بواسطة المتصفح. تتضمن التعليمات البرمجية من جانب العميل التعليمات البرمجية التي يتم تشغيلها على كمبيوتر المستخدم. نناقش على وجه التحديد JavaScript من جانب العميل في هذا القسم.
On the other side, server-side code is executed on the server, after which its results are retrieved and shown in the browser. Popular server-side web language instances include JavaScript, PHP, Python, Ruby, ASP.NET, and more.
Dynamic versus static code
The term “dynamic” refers to updating a web page or app to show various things in different conditions, creating new information as necessary. It is used to define both client-side JavaScript and server-side languages.
While client-side JavaScript dynamically creates new content within the browser on the client, such as creating a new HTML table, completing it with the information provided by the server, and then displaying the table on a website page shown to the user, server-side code dynamically produces new content on the server, such as pulling data from a database. Although the two settings have slightly distinct meanings, they are nevertheless connected, and both strategies (server-side and client-side) typically complement one another.
JavaScript Quickstart Tutorial
We'll quickly review the most significant JavaScript data types in this tutorial.
أ. JavaScript Variables
Data values are stored in containers called variables in JavaScript.
The variables in this example are x, y, and z:
Example
- var x = 5;
- var y = 6;
- var z = x + y;
From the example above, you can expect:
- x stores the value 5
- y stores the value 6
- z stores the value 11
ب. JavaScript Numbers
There is just one kind of number in JavaScript. You can write numbers with or without decimals.
Example
- var x = 3.14; // A number with decimals
- var y = 3; // A number without decimals
Double precision floating point numbers are used to hold all numbers.
ج. JavaScript Strings
Text is saved in strings. Strings are enclosed in quotation marks. Single or double quotations are acceptable:
Example
- var car name = “Volvo XC60”; // Double quotes
- var car name = 'Volvo XC60'; // Single quotes
The built-in property length contains the string's length:
Example
- var txt = “ABCDEFGHIJKLMNOPQRSTUVWXYZ”;
- var sln = txt.length;
d. JavaScript Objects
You already know that variables in JavaScript serve as storage spaces for data values.
Example:
This program gives the vehicle variable a straightforward value (Fiat):
Objects are variables as well, as in var vehicle = “Fiat.” But different values can exist within an object.
ه. JavaScript Arrays
Multiple values can be kept in a single data point using JavaScript arrays.
Example
var cars = ["Saab", "Volvo", "BMW"];
F. JavaScript Functions
A JavaScript function is a section of code created to carry out a certain purpose.
When “something” calls a JavaScript function, it is carried out (calls it).
Example
function myFunction(p1, p2) { return p1 * p2; // The function returns the product of p1 and p2 }
How Do You Add JavaScript Code to a Website?
JavaScript code may be added to an HTML web page both inside and externally.
Internal JavaScript employs the <script> tag in the HTML script's body to include all of the JavaScript code.
An illustration of internal JavaScript using the <script> tag:
<html> <head> <title>Inline JavaScript</title> <script type="text/javascript"> alert("Hello World"); </script> </head> <body> </body> </html>
You can also embed its script on HTML event attributes, prompting the browser to execute it when an event is triggered. This script type is called inline JavaScript:
<button>Click</button>
On the other hand, external JavaScript involves storing the code in a separate .js file and then recalling it within the HTML page. Developers often use this method when working on large projects, keeping the script organized.
Plus, it lets you reuse the script in multiple HTML pages, which is something that many developers value greatly. For example, adding the following script to an HTML page lets you recall an external JavaScript file named script.js:
<script src="script.js" defer></script>
فيما يلي مثال على كيفية الإشارة إلى ملف JavaScript خارجي:
<html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Time right now:</title> </head> <body> <button type="button">Select</button> </body> <script src="js/script.js"></script> </html>
يمكنك إنشاء وتعديل كود JavaScript باستخدام محرر نصوص.
لماذا نستخدم JavaScript على لغات البرمجة الأخرى؟
هناك العديد من الفوائد لاستخدام JavaScript على جميع لغات البرمجة النصية الأخرى لمصمم الويب ، بالإضافة إلى الإمكانات غير المحدودة:
- لغة البرمجة الأصلية الوحيدة لمتصفحات الويب هي JavaScript.
- اللغة الأكثر استخدامًا هي JavaScript.
- هناك حاجز دخول منخفض ، لتبدأ به.
- من الممتع التعلم.
كيف تختلف JavaScript عن لغات البرمجة الأخرى؟
نظرًا لأنها قابلة للتكيف ، أصبحت JavaScript واحدة من أكثر اللغات استخدامًا ما لم تتطلب وظائف محددة لا توفرها JavaScript ، لذا فإن العديد من مطوري JavaScript المحترفين هم خيارهم الأول.
فيما يلي عدد قليل من لغات البرمجة الأكثر استخدامًا:
أ. سي #
C # هي لغة برمجة موجهة للكائنات تستخدم في الإنشاء. تطبيقات متوافقة مع NET. نظرًا لأنه مطبوع بشكل ثابت ، فمن الممكن تحديد وقت التجميع لمتغيراته. بسبب تكديس المشغل والمحول في C # ، والذي يفتقر إليه JavaScript ، يمكنك تغيير أنواع البيانات.
ب. جافا
Java هو برنامج وتطبيق كبير يمكّن لغة البرمجة الموجهة للكائنات. يتم كتابة Java بإحكام ، على عكس JavaScript ، مما يستلزم ربط متغيراتها بأنواع بيانات معينة. لتشغيل البرنامج النصي الخاص به ، تحتاج Java إلى مترجم في الوقت المناسب (JIT).
ج. بي أتش بي
PHP هي لغة من جانب الخادم تُستخدم بشكل متكرر في WordPress وخدمات الويب الأخرى. تتمثل أهدافه الأساسية في نقل البيانات من وإلى الخادم وصفحات HTML معًا وتتبع الجلسات. PHP ، على عكس JavaScript ، يدعم معرفات الأحرف الصغيرة والرأسمالية ويمكنه بسهولة الحصول على قواعد البيانات.
د. روبي
روبي هو برنامج للأغراض العامة يسمح للبرمجة الوصفية ، مما يسمح له بدراسة وتغيير الكود والبرامج الأخرى. يتيح إطار Ruby on Rails ، أشهر أطره ، إمكانية إنشاء تطبيقات الويب المعقدة بسرعة وبتكلفة معقولة. تُعد بنية Ruby on Rails بمثابة تأثير على تنفيذ JavaScript في Node.js.
أين جافا سكريبت اليوم؟
تم إصدار أحدث إصدار من JavaScript ، ECMAScript 2017 ، في يونيو من ذلك العام. تسمى لغة البرمجة الديناميكية المتقدمة JavaScript.
JavaScript تتيح تطبيقاته لبرنامج من جانب العميل التفاعل مع المستخدم وإنشاء صفحات ديناميكية. يتم استخدامه بشكل متكرر كعنصر من مكونات مواقع الويب. تسمى لغة البرمجة النصية المفسرة ذات الميزات الموجهة للكائنات JavaScript.
أنشأت مواصفات ECMA-262 لغة JavaScript الأساسية.
- برنامج بسيط ومفسر هو JavaScript.
- مصممة لتطوير التطبيقات المتمحورة حول الشبكة.
- مرتبطة ومكملة لجافا.
- متصل ومكمل لـ HTML.
- مفتوح ومستقل عن النظام الأساسي
ما هو Vanilla JavaScript؟
عندما نشير إلى JavaScript خالص - المعروف أيضًا باسم JavaScript البسيط - بدون أي مكتبات إضافية ، فإننا نستخدم العبارة "نصوص الفانيليا". "اليوم ، يمكن أيضًا القيام بأشياء مختلفة دون استخدام أي مكتبات JavaScript إضافية" ، كانت نكتة شائعة.
يعد نص الفانيليا من بين أصغر الأطر التي تم إنشاؤها على الإطلاق. يعتبر كل من التعلم واستخدامه أمرًا بسيطًا وسهلاً حقًا. يمكن استخدام نص الفانيليا لتطوير التطبيقات والمواقع الرئيسية والمؤثرة. يحاول المهندسون الذين توصلوا إلى الإصدار الأول من JavaScript دائمًا تحسينه وجعله أكثر فائدة لمطوري الويب.
لماذا يجب أن تتعلم Vanilla JavaScript ؟
بدأنا التعلم واستخدام js الفانيليا للمشاريع لعدة أسباب. هنا ، سنتحدث عن أهم ثلاثة منهم.
1. أداء الويب
نظرًا لأنه المكون الأكثر تكلفة والأكثر أهمية في حزمة الواجهة الأمامية ، فهو أفضل بكثير لتصميم موقع الويب من العديد من الأطر والوحدات النمطية الأخرى. باستثناء ملفات HTML و CSS ، التي يمكن استخدامها مباشرة بعد التنزيل ، يجب إنشاء كود Vanilla js ومعالجته. مقارنة بملفات Html / CSS من نفس الطول ، فإن ملف 50kb js له تأثير أكبر بكثير على سرعة موقع الويب.
2. تجربة المستخدم
إنه يوفر تجربة بسيطة ولكنها سهلة الاستخدام عند التطوير. يجب على المطور فقط فتح معالج النصوص لبدء الترميز عند استخدام JavaScript لإنشاء تطبيق أو موقع ويب. لا يتعين على المطور المرور بعمليات شاقة مثل تثبيت npm ، ومراحل التجميع ، وعدم البناء ، وما إلى ذلك.
3. يجعل العمل مع الأطر أسهل أيضًا.
كما أنه يجعل التعامل مع أي مطور يختار الاستمرار في استخدام إحدى المنصات الأخرى أكثر متعة. نحن جميعًا ندرك أيضًا مدى صعوبة البدء في استخدام إطار عمل.
يقدم الدليل الكثير من الافتراضات حول المعرفة السابقة ومعرفة كيفية عمل كل أداة تجعل التعلم أكثر بساطة. يحاول العديد من المبتدئين الذين يفتقرون إلى الخبرة دراسة الأطر ، وهذا هو السبب في أنهم يضيعون كثيرًا ويتوقفون في النهاية عن التركيز على المفاهيم الأساسية لـ Vanilla js. بمجرد أن يشعروا بالراحة ، يبدأون في دراسة الأطر ، وفي هذه اللحظة ، يلتقطون الأشياء بسرعة أكبر.
4. تحميل الخادم
نظرًا لأن الجميع يعلم أن JavaScript يتم تنفيذه على العميل بدلاً من الخادم ، فإن استخدام الخادم مطلوب بشكل عام. بالإضافة إلى ذلك ، لا يعتمد البرنامج المباشر على الخادم على الإطلاق.
5. قابلية التشغيل البيني
على عكس لغات البرمجة الأخرى ، قد يتم تضمين JavaScript في أي صفحة ويب. على سبيل المثال ، PHP.
نتيجة لتوافقها مع لغات إضافية مثل PHP و Pearl وغيرها ، قد نستخدمها في تطبيقات مختلفة.
6. واجهات غنية
تمكننا JavaScript من إنشاء ميزات بجودة ممتازة مثل وظيفة السحب والإفلات وعناصر تشبه المنزلق. قد يكون لهذا تأثير إيجابي على تجارب زوار الموقع.
7. السرعة
سرعته رائعة لأنه ينفذ من جانب العميل ولا يحتاج إلى موارد خارجية. لا تؤثر الطلبات المرسلة إلى خادم خلفية على سرعة تشغيل JavaScript.
الفرق بين Java و JavaScript؟
معامل | جافا | جافا سكريبت |
طورت بواسطة | أنشأ جيمس جوسلينج من شركة صن مايكروسيستمز لغة جافا الموجهة للكائنات. | أنشأت Netscape جافا سكريبت ، والتي عُرفت لأول مرة باسم LiveScript. |
عمل | Java هي لغة برمجة نصية قائمة بذاتها يتم تشغيلها على Java Virtual Machine (JVM) عن طريق ترميز الكود المصدري للبايت. | JavaScript هي لغة برمجة يجب تضمينها داخل مستند HTML قبل تشغيلها أو تنفيذها بواسطة خادم ويب مثل Chrome و Firefox وما إلى ذلك. |
نوع اللغة | تسمى لغة البرمجة الشيئية القائمة على الفصل بـ Java. | لغة البرمجة القائمة على المثال هي JavaScript. |
نوع الكائن | تنتج Java كائنات بعد إنشاء فئة لأنها لغة قائمة على الفصل. | يتم إنشاء كائنات JavaScript المستندة إلى النموذج الأولي من كائن نموذج أولي واحد. |
إعلان متغير | تتيح Java الكتابة الثابتة ، الأمر الذي يستلزم إعلان المتغيرات والأنواع قبل التجميع والتنفيذ. | تقدم JavaScript كتابة ديناميكية ، مما يسمح للمبرمجين بتحديد الفئة والكائن في أي لحظة. على سبيل المثال ، أثناء نوع التحويل البرمجي ، لا تحتاج إلى التصريح عن نوع المتغير (عدد صحيح ، عدد عشري ، إلخ). حتى طوال وقت التشغيل ، يمكنك القيام بذلك. |
التزامن (وظيفة التعامل مع تعليمات مختلفة في نفس الوقت) | تستخدم Java خيوط المعالجة المتعددة لتسهيل وضمان التزامن ، مما يجعل التطبيق أكثر فعالية وأسرع. | التنفيذ المتزامن لعدة أحداث أو التزامن غير مدعوم في JavaScript. |
التجميع والتفسير | يمكن ترجمة Java وتفسيرها. يتم ترجمته إلى كود بايت وتشغيله على JVM. | يتم فقط تفسير JavaScript مباشرة على متصفح الويب. |
رؤية كود المصدر | تستخدم Java تشفير البايت لإخفاء كود المصدر ، مما يجعل قراءته مستحيلة على غير المصرح لهم أو أطراف أخرى. | Javascript ، لغة برمجة نصية ، تنفذ تعليمات برمجية على متصفح متاح للجميع بنص عادي. |
متطلبات | أنت بحاجة إلى Java Development Kit بالكامل لإنشاء وتنفيذ برنامج Java (JDK). | تحتاج كتابة التعليمات البرمجية لجافا سكريبت ببساطة إلى محرر نصوص. |
بناء الجملة | في Java ، يجب تحديد أنواع البيانات. | جافا سكريبت لا تحتاج التصريح عن أنواع البيانات. |
حماية | تم تطوير Java بهدف أساسي وهو حماية الكود المصدري. ولها ميزات قوية لدعمها. | لغة برمجة JavaScript ليست آمنة بشكل أساسي لأنها مرئية للجميع بنص عادي. يجب على المبرمجين دمج ميزات جديدة للأمان الصارم. |
امتداد الملف | تدعم Java ملفات. جافا ”امتداد الملف. | ال ". نظام ملفات JavaScript ”متوافق مع JavaScript. |
ملاءمة | يمكن استخدام Java لإنشاء مجموعة متنوعة من أنواع التطبيقات ، بما في ذلك التطبيقات المستندة إلى الويب وخدمات الهاتف المحمول والتطبيقات المستندة إلى السحابة وتقنيات البيانات الضخمة. | ومع ذلك ، مع أحدث المراجعات وإضافة Node ، يتم الآن استخدام JavaScript إلى حد كبير لتطوير الجانب الأمامي. تعد برمجة الألعاب ، وتطوير التطبيقات عبر الإنترنت والهاتف المحمول ، وتطوير تطبيقات الويب والخادم كلها استخدامات ممكنة لـ JavaScript. |
دلائل الميزات | مكتبات كبيرة بسيطة وسهلة التعلم ؛ جمع | أطر عمل قوية وخفيفة الوزن وممتازة لتطوير الواجهة الأمامية |
الشركات التي تستخدم | Google و Netflix و Airbnb وما إلى ذلك. | Microsoft و Uber و PayPal وما إلى ذلك. |
مترجم جافا
يجب أن يقوم المترجم أولاً بتحليل (أو تحليل) كل كلمة من جملة الجملة حسب السياق خطوة بخطوة ، بالترتيب ، بخطوة متتالية أو أكثر (يشار إليها أحيانًا باسم "يمر") قبل إنشاء البرنامج المستهدف أثناء التعليمات البرمجية القابلة للتنفيذ (وقت التشغيل) . يضمن المترجم أن العبارات التي تحتوي على مراجع لأسطر أخرى من التعليمات البرمجية يتم فرزها بالتسلسل.
عادة ما يشار إلى المخرجات التي ينتجها المترجم على أنها رمز كائن أو مكون كائن. يتم استخدام مصطلح "كائن" هنا دون الإشارة إلى البرمجة الشيئية. يشير مصطلح "كود الكائن" إلى نوع من لغة التجميع حيث يقوم المعالج بتنفيذ برنامج واحد في كل مرة.
عوامل تشغيل جافا سكريبت
عامل التشغيل في JavaScript هو رمز فريد يستخدم لتنفيذ إجراءات على العمليات الحسابية (القيم والمتغيرات). في هذه الحالة ، 2 + 3 ؛ / 5. هنا ، عامل + ينفذ عملية الجمع ، والمعاملات 2 و 3.
أنواع مشغل JavaScript
أ. مشغلي التخصيص
اعتمادًا على تكلفة المعامل الأيمن ، يساهم عامل التخصيص بشكل إيجابي في معامله الأيسر. يساوي (=) ، عامل تعيين مباشر ، ينقل قيمة معامله الأيمن إلى معامله الأيسر.
ب. عامل حسابي
عامل رياضي يعمل مع كل من المجموعات والأعداد الصحيحة. في AHDL ، تعتبر البادئة والرموز الثنائية زائد (+) وسالب (-) معادلات رياضية مقبولة في العبارات المنطقية.
ج. عوامل المقارنة
يمكن لعوامل المقارنة تقييم ومقارنة السلاسل أو الأرقام. على عكس التعبيرات الحسابية ، لا تُرجع تعبيرات عامل المقارنة نتيجة عددية. توفر تعبيرات المقارنة إحدى نتيجتين: 1 (تشير إلى صواب) أو 0 (تشير إلى خطأ).
د. العوامل المنطقية
سيكون العامل المنطقي عبارة عن رمز أو كلمة تربط بين عبارتين أو أكثر بحيث تعتمد صحة التعبيرات المركبة الناتجة فقط على قيمة المتغيرات الأصلية وتفسير المشغل. غالبًا ما يتم استخدام عوامل التشغيل المنطقية AND و OR و NOT.
ه. عوامل Bitwise
عند أداء واجبات على بتات البيانات أو العمليات الحسابية التي تتطلب تعديل البتات الفردية ، يتم استخدام عامل بت. فيما يتعلق بالمكدسات المتصلة حيث تمثل البتات المحددة في الرأس المرتبطة بالبيانات معلومات مهمة ، يتم استخدام عمليات البت.
F. عوامل السلسلة
يتم تمثيل الأنواع العديدة من العمليات التي قد نقوم بها على المتغيرات في البرنامج التي لها نوع سلسلة بواسطة مشغلي السلسلة.
ز. المشغلون الآخرون
يتم توظيف مشغلين آخرين لتنفيذ بعض العمليات الحسابية والمنطقية على المعاملات. يتم تشغيل المعاملات من قبل عامل ، بمعنى آخر. في JavaScript ، تُستخدم العوامل لتنفيذ العمليات الحسابية ومقارنة البيانات وتنفيذ مهام أخرى.
التقنيات ذات الصلة
1. جافا
من المفاهيم الخاطئة الشائعة أن جافا سكريبت وجافا قابلة للتبادل. كلاهما لهما بالفعل بناء جملة مشابه لـ C. بالإضافة إلى ذلك ، عند استخدامها داخل متصفح ، يتم وضع الحماية لهما كثيرًا منذ إنشاء JavaScript مع وضع لغة Java والمكتبة الأساسية في الاعتبار. على وجه الخصوص ، احتفظت JavaScript الأصلي بجميع كلمات Java الأساسية ، واتبع معرفات Java في مكتبتها القياسية ، واستمدت عناصر الرياضيات والتاريخ من فئات Java 1.0.
2. JSON
JSON ، أو JavaScript Object Notation ، هو تنسيق ملف نظام مفتوح وتنسيق تبادل بيانات يستخدم لغة يمكن للبشر قراءتها لتخزين وإرسال كائنات البيانات المكونة من أزواج ومجموعات قيمة السمات (أو قيم أخرى قابلة للتسلسل). إنه تنسيق بيانات مستخدم على نطاق واسع لتبادل البيانات الإلكترونية ، لا سيما بين الخوادم والتطبيقات عبر الإنترنت.
3. WebAssembly
بالإضافة إلى تحديد تنسيق الكود الثنائي المضغوط وتنسيق النص ذي الصلة للبرامج القابلة للتشغيل ، يحدد WebAssembly (غالبًا ما يُختصر باسم Wasm) أيضًا بروتوكولات البرامج لتسهيل التفاعلات بين هذه التطبيقات ومتكامل النظام الخاص بهم.
يتمثل الهدف الأساسي لـ WebAssembly في تمكين تشغيل البرامج عالية الأداء على صفحات الويب. ومع ذلك ، نظرًا لأنه لا يقدم أي تأكيدات خاصة بالويب أو يقدم إمكانات خاصة بالويب ، فقد يتم استخدامه أيضًا في إعدادات أخرى. في الواقع ، تتمتع إحدى لغات البرمجة الأكثر شيوعًا بدرجة معينة من المساعدة على الأقل لأنها منصة مفتوحة تطمح لخدمة أي برنامج نصي على أي نظام كمبيوتر.
4. Transpilers
يقوم المترجم من المصدر إلى المصدر ، المعروف أيضًا باسم مترجم S2S أو محول التحويل أو المترجم ، بتحويل كود مصدر البرنامج إلى كود مصدر مكافئ في لغة برمجة أخرى.
ما هي الشركات التي تستخدم JavaScript؟
1. مايكروسوفت
لإنشاء مستعرض ويب Edge الخاص بها ، يتعين على Microsoft التعاون بشكل وثيق مع JavaScript. قامت Microsoft بإنشاء وتشغيل معالج JavaScript الخاص بها لـ Edge نظرًا لأن المعالجة السريعة وتنفيذ JavaScript متطلبات لجميع المتصفحات. في الواقع ، كان هناك نقاش حول إنتاج إصدار NodeJS مختلف يستخدم محرك Edge.
2. باي بال
في الواجهة الأمامية لصفحة الويب ، استخدم PayPal بلا شك JavaScript لفترة طويلة ، لكنها البداية فقط. كان أحد أوائل مستخدمي NodeJS هو الرائد في مجال الدفع عبر الإنترنت.
3. نيتفليكس
على غرار PayPal ، قامت Netflix في البداية بكل شيء تقريبًا في Java. لقد واجهوا أيضًا مشكلات بسبب حجم Java وطول تطويرها.
عندما تم تقديم NodeJS ، تحول Netflix تدريجياً بعيدًا عن هيكله التنظيمي الأكثر تقليدية واتجه نحو السحابة.
4. أوبر
يجب أن تدير أوبر كميات هائلة من المعلومات في غضون وقت قصير. إنهم يتلقون ملايين الطلبات يوميًا ، وهذه ليست مجرد مشاهدات للصفحة. يجب أن تراقب أوبر أماكن تواجد السائقين والركاب وطلبات الرحلات الواردة. يجب أن يفرز هذه البيانات بكفاءة ويتطابق بسرعة مع الدراجين.
كل ذلك يعزز فوائد JavaScript و NodeJS. تم تصميم العقدة للتعامل مع الطلبات ونقل البيانات بسرعة.
5. الفيسبوك
كما تعلم بالتأكيد ، يستخدم Facebook JavaScript. من الصعب تفويتها قليلاً. يبدو أن مقدار استخدام JavaScript في إنشاء Facebook ، وكذلك مقدار مشاركة Facebook في تطوير JavaScript ، ليس واضحًا على الأرجح.
6. جوجل
تنشئ Google أدوات جافا سكريبت التي تستخدمها وتوفرها غالبًا. الرسم الأكثر بروزًا هو AngularJS. أصبح Angular أحد أكثر أطر عمل الواجهات الأمامية المحبوبة هناك ، ويستخدم بشكل متكرر في منصة إعلانات Google DoubleClick.
بدائل JavaScript
1. دارت
تم تصميم Dart للإنتاجية ، مما يجعل إكمال المهام أسهل من JavaScript. على الرغم من أن Google تقوم بتطويره كثيرًا ، إلا أنه لا يزال يقدم ميزات أقل من JavaScript.
2. TypeScript
قامت Microsoft بإنشاء TypeScript لتحسين وظائف JavaScript. يعتبر معظم المستخدمين رمز TypeScript قويًا وأقل عرضة للأخطاء ، ويعتقدون أيضًا أنه قد يكون محرجًا وصعبًا إلى حد ما.
3. كوفي سكريبت
لتسهيل القراءة ، وأقصر وأبسط الشفرة ، يتم تحويل لغة CoffeeScript إلى JS. ولكن لا يزال يتعين عليك أن تكون خبيرًا في JavaScript إذا كنت تستخدم CoffeeScript.
4. علم
Elm هي لغة عملية صغيرة نسبيًا وتوفر بيئة تطوير ويب متطورة. يتم استخدامه عادة لإنشاء واجهات مستخدم مرئية. يضمن نظام الكتابة المتطور لهذه اللغة أن برامج الإنتاج لن تتضمن أبدًا خطأ وقت التشغيل.
5. بايثون
واحدة من بدائل JavaScript الأكثر شهرة لتطوير الواجهة الخلفية تتضمن Python. يعتبر بناء جملة لغة Python واضحًا إلى حد ما بحيث يمكن للمبتدئين فهمه.
6. Kotlin
لغة البرمجة النصية الخلفية الأخرى ذات قابلية قراءة أعلى ومتطلبات تأليف أقل هي Kotlin. نظرًا لأن الأعمال التجارية بدلاً من الأكاديميين هي التي أنشأتها ، تركز Kotlin بشكل أكبر على مواجهة مطوري مشكلات العالم الحقيقي.
7. روبي
روبي هي لغة برمجة نصية قوية ومكتوبة ديناميكيًا وموجهة للكائنات مع بناء جملة مباشر إلى حد ما يشبه إلى حد كبير اللغة الإنجليزية. على الرغم من أنها أبطأ قليلاً من Python ، إلا أنها واحدة من أكثر البدائل استخدامًا على نطاق واسع.
8. PHP
بخصائصها المثالية والقابلة للتكيف ، يقال إن PHP هي لغة البرمجة الخلفية للمستقبل. بسبب القواعد النحوية الوصفية لهذه اللغة ، لديك بعض المرونة الإبداعية.
9. الاستجابة الأصلية
نموذج عملية مفتوح المصدر ، يستخدم React Native لإنشاء تطبيقات أصلية عبر الأنظمة الأساسية. إنها تستفيد من لغات برمجة React و JavaScript لإنشاء تطبيقات جوال مطابقة تقريبًا للتطبيقات الأصلية التي تم إنشاؤها في Java أو Objective-C.
10. NativeScript
إطار عمل آخر مفيد للغاية لإنشاء تطبيقات أصلية عبر الأنظمة الأساسية باستخدام JavaScript أو TypeScript هو NativeScript. يمكن توزيع قاعدة بيانات واحدة على العديد من الأنظمة الأساسية ، بما في ذلك Android و iOS ، من خلال استخدام أدوات مشاركة التعليمات البرمجية مثل Angular أو Vue.js.
11. أيوني
إطار عمل JavaScript آخر محبوب لإنشاء تطبيقات هجينة هو Ionic. مع توصيل البرنامج الأساسي بالجهاز ، يمكن للمطورين استخدام مكونات كوردوفا الإضافية التي تسمح للأشخاص بالوصول إلى المعدات والبرامج من مثل هذا الجهاز المحمول.
بالإضافة إلى الفرص المستقبلية للواجهة الأمامية والخلفية التي تمت مناقشتها بالفعل ، قد ترغب أيضًا في إلقاء نظرة على بدائل تطبيقات الويب ذات الصلة.
12. ClojureScript
هناك بديل موثوق لجافا سكريبت يسمى ClojureScript يجعل من السهل ترجمة لغة برمجة Clojure إلى JavaScript. يعمل على قمة Java Virtual Machine ، سيكون Clojure هو Lisp الذي يمكنه الوصول إلى جميع مكتبات Java الحالية.
13. بابل
يتوافق إصدار ES5 من برنامج ECMA النصي مع JavaScript ، ولكن ES6 يوفر العديد من الإمكانات المثيرة للاهتمام التي لا يدعمها JavaScript حاليًا. سيتم تحويل كود ES6 JavaScript الخاص بك إلى كود JS متوافق مع ES5 باستخدام المترجم Babel.
تغليف
بالطبع ، لدى JavaScript الكثير من المنافسين في العالم الحديث. من السهل جدًا التبديل من Node.js إلى أي لغة برمجة أخرى مستخدمة على نطاق واسع ، بما في ذلك Python و C و C ++ و Kotlin و Ruby و Smalltalk والمزيد ، خاصة بالنسبة للنصوص أو التطبيقات الروتينية.
قد يكون JavaScript هو خيارك الوحيد لتطوير الواجهة الأمامية ، على الرغم من ذلك. لا يزال بإمكانك استخدام transpilers لترجمة قاعدة التعليمات البرمجية الخاصة بك إلى JavaScript مقبول في المتصفح. لقد استخدمت JavaScript خلال مسيرتك المهنية في شركة تطوير ويب ، وربما تبحث عن أفضل حلول JavaScript في الوقت الحالي. منذ تقديمها في عام 1995 ، أصبحت JavaScript لغة شائعة بين المطورين في جميع أنحاء العالم. مع حوالي 68 ٪ من المشاركين في الاستطلاع ، ظلت لغة البرمجة النصية الأكثر شيوعًا اعتبارًا من أوائل عام 2020.
قد ترغب أيضًا في القراءة
- الفرق بين React Typescript و React JavaScript و React Native
- أفضل أطر تطوير الويب (الواجهة الأمامية والخلفية)
- أفضل أطر تطوير التطبيقات عبر الأنظمة الأساسية
- ما هو تطوير المكدس الكامل؟ مقدمة مختصرة