اذهب إلى المحتوى

مراجعة لما سبق حول جافاسكربت


سجى الحاج

يلخِّص هذا الدرس مُميِّزات JavaScript التي تعرَّفنا عليها باختصار في الدروس السابقة مع إيلاء اهتمام خاص لأدق المواضيع.

صياغة الشيفرة

تنتهي التعليمات البرمجية في JavaScript بفاصلة منقوطة ;:

alert('مرحبًا'); alert('بالعالم');

يمكنك إنهاء تعليمة برمجية ببدء سطر جديد، إذ يعد محرف السطر الجديد على أنَّه فاصل للتعليمات:

alert('مرحبًا')
alert('بالعالم')

هذا ما يسمى «الإدراج التلقائي للفاصلة المنقوطة» (automatic semicolon insertion)، لكن يعمل كما هو متوقع في بعض الأحيان مثل الحالة التالية:

alert("سيحدث خطأ هنا بعد الرسالة")
[1, 2].forEach(alert)

تخبرك أغلب أدلة الصياغة بضرورة وضع فاصلة منقوطة بعد كل تعليمة برمجية (statement). انتبه إلى أنَّ الفاصلة المنقوطة غير مطلوبة بعد الكتل البرمجية {...} مثل كل الدوال وحلقات التكرار وغيرها:

function f() {
  // لا حاجة لفاصلة منقوطة بعد التصريح عن دالة
}
for(;;) {
  // لا حاجة لفاصلة منقوطة بعد حلقة تكرار
}

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

تجد المزيد في فصل «بنية الشيفرة».

الوضع الصارم

إن أردت تمكين جميع ميزات JavaScript الحديثة كاملًا، يجب أن تستفتح السكربت بالموجه "use strict" مثل:

'use strict';
...

يجب أن يُكتَب هذا الموجِّه في بداية السكربت أو في بداية جسم الدالة.

تعمل الشيفرة بدون الموجه "use strict"، لكن هناك بعض الميزات تبقى على صورتها القديمة «المتوافقة» (compatible way). عمومًا، يُفضَّل العمل بالوضع الحديث دومًا.

تُفعِّل بعض مميزات JavaScript الحديثة، مثل الأصناف التي ستتعرف عليها لاحقًا، الوضع الصارم ضمنيًّا.

تجد المزيد في فصل «الوضع الصارم: ».

المتغيرات

يمكنك تعريف المتغيرات عبر:

  • let
  • const (متغير ثابت لا يمكن تغيير قيمته)
  • var (نمط قديم سوف تتعرف عليه لاحقًا)

يمكن أن يحتوي اسم المتغير على:

  • حروف وأعداد، لكن الحرف الأول لا يجب أن يكون عددًا.
  • الرمزان _ و $.
  • يُسمَح أيضًا باستخدام الحروف الهجائية غير اللاتينية والحروف الهيروغليفية، ولكنها غير شائعة الاستخدام.

يمكنك تخزين أي قيمة داخل المتغير مثل:

let x = 5;
x = "عبد الله";

إليك سبعة أنواع من البيانات:

  • number: يمثِّل الأعداد العشرية والأعداد الصحيحة.
  • string: يمثِّل السلاسل النصية.
  • boolean: يمثِّل القيم المنطقية: true/false.
  • null: هذا النوع يعني أن القيمة «فارغة» أو «غير موجودة».
  • undefined: هذا النوع يعني أن القيمة «غير معرّفة».
  • object و symbol: يمثِّل الأول بنية معقدة من البيانات والثاني مُعرِّفًا فريدًا، لم نسلط الضوء عليهما بعد.

يرجع المعامل typeof نوع القيمة، مع استثناءين:

typeof null == "object" // خطأ من أصل اللغة
typeof function(){} == "function" // تعامل الدوال معاملةً خاصة

تجد المزيد في فصل «المتغيرات وأنواع البيانات».

الدوال التفاعلية

لمَّا كنا نستعمل المتصفح بيئة عمل لنا، فستكون دوال واجهة المستخدم الأساسية هي:

  • prompt(question, [default])‎: هي دالة تطرح السؤال question، ثم ترجع ما أدخله المستخدم أو تُرجع القيمة null في حال ألغى المستخدم عملية الإدخال (بالضغط على الزر "cancel").
  • confirm(question)‎: هي دالة تطرح السؤال question ثم تُتيح لك الاختيار بين «موافق» (Ok) أو «إلغاء» (Cancel) ثم تعاد قيمة منطقية، true/false، تمثِّل هذا الاختيار.
  • alert(message)‎: دالةٌ تُظهِر لك الرسالة message المُمرَّرة إليها فقط.

تظهر جميع هذه الدوال نافذة صغيرة تدعى «النافذة المنبثقة الشرطية» (modal window، وهي عنصر تحكم رسومي)، فهي توقف تنفيذ الشيفرة وتمنع المستخدم من التفاعل مع صفحة الويب حتى يتفاعل معها.

جرب تنفيذ المثال التالي:

let userName = prompt("ما اسمك؟‎", "محمد");
let isTeaWanted = confirm("هل تريد كوبًا من الشاي؟");
alert( "الزائر: " + userName ); // محمد
alert( "أيريد كوبًا من الشاي؟" + isTeaWanted ); // true

تجد المزيد في فصل «الدوال التفاعلية».

المعاملات

تدعم JavaScript المعاملات التالية:

المعاملات الحسابية

معاملات الحساب الأساسية وهي * + - / بالإضافة إلى المعامل % لإيجاد باقي القسمة، و أيضًا معامل القوة **.

يدمج معامل الجمع الثنائي + السلاسل النصية. إذا كان أحد العاملين عبارة عن سلسلة نصية، فسيُحوَّل الآخر إلى سلسلة نصية أيضًا مثل:

alert( '1' + 2 ); // '12', سلسلة نصية
alert( 1 + '2' ); // '12', سلسلة نصية

معاملات الإسناد

هنالك معامل إسناد بسيط وهو a = b ومعامل إسناد مركَّب مثل a *= 2.

المعاملات الثنائية

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

المعاملات الشرطية

المعامل الوحيد الذي يحوي ثلاث عوامل هو معامل علامة استفهام ? أو كما يسمى «المعامل الثلاثي»:

cond ? resultA : resultB

إذا تحقق الشرط cond، يُرجع المعامل القيمة resultA؛ خلا ذلك، يُرجع القيمة resultB.

المعاملات المنطقية

ينفِّذ المعاملان المنطقيان AND && و OR || «دارة تقييم قصيرة» (short-circuit evaluation) ثمَّ يرجعان القيمة المُقيَّمة الناتجة. يُحوِّل المعامل المنطقي NOT ! العامل الذي استدعي معه لقيمة منطقية ثم يُرجع القيمة المعاكسة له.

  • معاملات الموازنة يُحوّل معامل المساواة == القيم المختلفة إلى أعداد ثم يتحقق من المساواة (ما عدا القيمة الفارغة null والقيمة غير المُعرَّفة undefined التي تساوي بعضها بعضًا). إليك المثال التالي:
alert( 0 == false ); // true
alert( 0 == '' ); // true

وكذلك تفعل معاملات الموازنة الأخرى.

فيما يخص معامل المساواة الصارمة === لا يُوحَّد نوع القيم المراد التحقق من تساويها، إذ تعد عملية التحقق من نوعين مختلفين بالنسبة لهذا المعامل عملية غير محققة دومًا (أي النوعان غير متساويين).

تعدُّ القيمة الفارغة null والقيمة غير المحددة undefined حالة خاصة، إذ تساوي إحداهما الأخرى (عبر المعامل ==) ولا تساويان أي شيء آخر.

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

معاملات أخرى

هنالك معاملات أخرى غير شائعة الاستخدام مثل معامل الفاصلة.

تجد المزيد في الفصول التالية: فصل «المعاملات في JavaScript» وفصل «معاملات الموازنة» وفصل «المعاملات المنطقية».

حلقات التكرار

لقد غطينا ثلاثة أنواع من حلقات التكرار هي:

// 1
while (condition) {
  ...
}
// 2
do {
  ...
} while (condition);
// 3
for(let i = 0; i < 10; i++) {
  ...
}

المتغير الذي يُعرَّف داخل حلقة التكرار for(let...)‎ مرئيٌّ داخلها فقط، ولكن يمكنك حذف let وإعادة استخدام المتغير.

يأمر الموجهان break/continue بإنهاء التكرار الحالي والعودة للحلقة (continue) أو الخروج من الحلقة بأكملها (break). يمكن استخدام اللافتات (labels) للتحكم بالحلقات المتداخلة وإنهائها مثلًا.

تجد المزيد في فصل «حلقتي التكرار while و for». وسوف نتعرف لاحقًا على المزيد من حلقات التكرار.

التعبير switch

يمكن للتعبير switch أن يحل محل التعبير الشرطي if، إذ يمنحك طريقة وصفية أكثر لموازنة قيمة ما مع عدَّة قيم. ويستخدم معامل المساواة الصارمة === في عملية الموازنة. إليك المثال التالي:

let age = prompt('كم عمرك؟‎', 18);
switch (age) {
  case 18:
    alert("لن يعمل"); // ‎الناتج سلسلة نصية وليس عدد
  case "18":
    alert("يعمل");
    break;
  default:
    alert("أي قيمة غير مساوية للقيمتين السابقتين");
}

تجد المزيد في فصل «التعبير switch».

الدوال

إليك ثلاث طرائق لإنشاء دالة في JavaScript: 1- التصريح عن دالة: تُعَّرف الدالة في سياق الشيفرة الرئيسية (ضمن النطاق العام) بشكل منفصل عن بقية التعليمات:

function sum(a, b) {
  let result = a + b;
  return result;
}

2- تعبير دالة: تُنشَأ الدالة داخل تعبير برمجي أو داخل كتلة برمجية أخرى:

let sum = function(a, b) {
  let result = a + b;
  return result;
};

3- الدوال السهمية:

// التعبير في الطرف الأيمن
let sum = (a, b) => a + b;
// يمكن أن تمتد على عدة أسطر باستعمال الأقواس المعقوصة شرط إعادة شيء
let sum = (a, b) => {
  // ...
  return a + b;
}
// دون معاملات
let sayHi = () => alert("مرحبًا");
// مع معامل وحيد
let double = n => n * 2;
  • قد تحتوي الدوال على متغيرات محلية، إذ تُعرَّف تلك المتغيرات داخل جسم الدالة وتبقى مرئيًّة داخل الدالة فقط.
  • يمكن أن تملك المعاملات قيمًا افتراضية مثل: function sum(a = 1, b = 2) {...}‎.
  • تُرجع الدوال قيمة ما دائمًا. وإذا لم يكن هناك الموجه return، فستكون تلك القيمة المعادة القيمة undefined. تجد المزيد في فصل «الدوال».

المزيد قادم

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

ترجمة -وبتصرف- للفصل JavaScript specials من كتاب The JavaScript Language

اقرأ أيضًا


تفاعل الأعضاء

أفضل التعليقات

لا توجد أية تعليقات بعد



انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أضف تعليق

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • أضف...