JS / قواعد كتابة الكود

قواعد كتابة الكود

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

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

مهما كان المجال الذي ستستخدم جافاسكربت به فإن أسلوب كتابة الكود الذي ستتعلمه في هذا الدرس هو نفسه.

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

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

حساسية الأحرف

جافاسكربت تطبق مفهوم حساسية الأحرف (Case Sensitivity) و هذا يعني أنها تميز بين الأحرف الكبيرة و الأحرف الصغيرة.

مثال: note و Note ليسا شيئاً واحداً.

أسماء المعرّفات

جافاسكربت تعتمد أسلوب Camel Case في كتابة أسماء الأشياء التي يتم تعريفها. لذا إستخدم الأحرف الصغيرة عند اختيار أسماء للمتغيرات أو للدوال و في حال كان الإسم يتألف من أكثر من كلمة فإبدأ أول كلمة بحرف صغير و كل كلمة بعدها إبدأها بحرف كبير.

أمثلة

في حال كان الإسم يتألف من كلمة واحدة.

var age;

في حال كان الإسم يتألف من أكثر من كلمة.

var firstName;

الفاصلة المنقوطة

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

أمثلة

var name = 'Mhamad';

var country = 'Lebanon';

المسافات الفارغة

في جافاسكربت المسافات الفارغة و الأسطر الفارغة لا تسبب مشكلة في الكود و لكن عليك استخدامها بشكل مناسب يساعدك في قراءة الكود.

أمثلة

لاحظ كم هو مريح للنظر أن تبعد رمز المساواة عن الإسم و القيمة.

var language = 'Arabic';

و لاحظ كم هو سيء للنظر أن تلصق رمز المساواة بالإسم و القيمة.

var language='Arabic';

التعليقات

نستخدم التعليقات لنضع ملاحظات حول الكود الذي كتبناه فقط، لكي لا ننسى كيف برمجنا الكود في حال أردنا مراجعته أو التعديل عليه بعد وقت طويل. و بالطبع التعليقات لا تؤثر إطلاقاً على الكود المكتوب.

في جافاسكربت يوجد أسلوبين لوضع التعليقات:

• تعليق على سطر واحد.
• تعليق على عدة أسطر.

أمثلة

في حال كان التعليق يتألف من سطر واحد, نضع الرمز // قبل كتابة التعليق.

// this is a one line comment    تعليق يتألف من سطر واحد

في حال كان التعليق يتألف من عدة أسطر، نبدأ التعليق بالرمز /* و ننهيه بالرمز */.

/*

    This is multlines comment 
    هذا التعليق يتألف من عدة أسطر
*/

الأحرف المستخدمة في وضع الأسماء في جافاسكربت

أي إسم نضعه لمتغير، دالة، كلاس، كائن إلخ.. يسمى identifier في البرمجة.
في جافاسكربت كل عنصر نريد تعريفه علينا إعطاءه إسم خاص لم نقم باستخدامه من قبل.

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

قواعد إلزامية عند إعطاء الأسماء

1. يجب أن يبدأ بحرف كبير بين A-Z أو حرف صغير بين a-z أو رمز الدولار $ أو الشرطة _.
2. يمنع أن يبدأ برقم.
3. يمنع استخدام القيم الموجودة في جافاسكربت (Literals)، كأسماء، أي يمنع استخدام القيمة true و القيمة false.
4. يمنع إستخدام أي كلمة من الكلمات المحجوزة (Keywords).

الكلمات المحجوزة في جافاسكربت عددها كبير نوعاً ما فهي قد تتغير ما بين إصدار و آخر و على حسب المنصة التي فيها كتابة الكود. هنا تجد جميع الكلمات المحجوزة في لغة جافاسكربت.

الكلمات المحجوزة في جافاسكربت

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

abstract arguments boolean break byte case catch char const continue debugger default delete do double else eval false final finally float for function goto if implements in instanceof int interface long native new null package private protected public return short static switch synchronized this throw throws transient true try typeof var void volatile while with yield

كلمات محجوزة أضيفت على الإصدار ES5

أضيفت الكلمات التالية ككلمات محجوزة في جافاسكربت ابتداءاً من الإصدار ES5 و الإصدارات التي تليه:

awaits class enum export extends import let super

كلمات لم تعد محجوزة في الإصدار ES5

لم تعد الكلمات التالية محجوزة في جافاسكربت ابتداءاً من الإصدار ES5 و الإصدارات التي تليه:

abstract boolean byte char double final float goto int long native short synchronized throws transient volatile

كلمات محجوزة في المنصات

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

alert all anchor area anchors assign blur button checkbox clearInterval clearTimeout clientInformation close closed confirm constructor crypto decodeURI decodeURIComponent defaultStatus document element elements embed embeds encodeURI encodeURIComponent escape event fileUpload focus form forms frame innerHeight innerWidth layer link location mimeTypes navigate navigator frames frameRate hidden history image images offscreenBuffering open opener option outerWidth outerHeight packages pageXOffset pageYOffset parent parseFloat parseInt password pkcs11 plugin prompt propertyIsEnum radio reset screenX screenY scroll secure select self setInterval setTimeout status submit taint text textarea top unescape untaint window

كلمات محجوزة في HTML

الكلمات التالية محجوزة كأسماء أحداث (Events) في صفحات الويب و لذلك ينصح بعدم استخدامها في جافاسكربت:

onblur onclick onerror onfocus onkeydown onkeypress onkeyup onmouseover onload onmouseup onmousedown onsubmit

الكلمات المحجوزة في جافاسكربت

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

abstract arguments boolean break byte case catch char const continue debugger default delete do double else eval false final finally float for function goto if implements in instanceof int interface long native new null package private protected public return short static switch synchronized this throw throws transient true try typeof var void volatile while with yield

كلمات محجوزة أضيفت على الإصدار ES5

أضيفت الكلمات التالية ككلمات محجوزة في جافاسكربت ابتداءاً من الإصدار ES5 و الإصدارات التي تليه:

awaits class enum export extends import let super

كلمات لم تعد محجوزة في الإصدار ES5

لم تعد الكلمات التالية محجوزة في جافاسكربت ابتداءاً من الإصدار ES5 و الإصدارات التي تليه:

abstract boolean byte char double final float goto int long native short synchronized throws transient volatile

كلمات محجوزة في المنصات

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

alert all anchor area anchors assign blur button checkbox clearInterval clearTimeout clientInformation close closed confirm constructor crypto decodeURI decodeURIComponent defaultStatus document element elements embed embeds encodeURI encodeURIComponent escape event fileUpload focus form forms frame innerHeight innerWidth layer link location mimeTypes navigate navigator frames frameRate hidden history image images offscreenBuffering open opener option outerWidth outerHeight packages pageXOffset pageYOffset parent parseFloat parseInt password pkcs11 plugin prompt propertyIsEnum radio reset screenX screenY scroll secure select self setInterval setTimeout status submit taint text textarea top unescape untaint window

كلمات محجوزة في HTML

الكلمات التالية محجوزة كأسماء أحداث (Events) في صفحات الويب و لذلك ينصح بعدم استخدامها في جافاسكربت:

onblur onclick onerror onfocus onkeydown onkeypress onkeyup onmouseover onload onmouseup onmousedown onsubmit

ركز على أول حرف فقط

• أمثلة للأسماء التي يسمح باستخدامها: Harmash ، name ، $password ، _number
• أمثلة للأسماء التي يمنع استخدامها: 1st ، -cash ، @user

في الدرس التالي سنتعرف على الطرق التي يمكن من خلالها تضمين كود جافاسكربت في صفحات الويب.