أفضل ممارساتي – JavaScript

1. تعطيل ذاكرة التخزين المؤقت

Firefox:
افتح أدوات المطوّر (Developer Tools) -> افتح الإعدادات (F1) -> "Disable HTTP Cache (when toolbox is open)"

Chrome:
افتح أدوات المطوّر (Developer Tools) -> افتح الإعدادات (F1) -> "Disable cache (while DevTools is open)"

2. أبقِ وحدة تحكم JS مفتوحة

افتح تبويب Console في أدوات المطوّر وأبقِه مفتوحًا، حتى تظل الخطوة 1 سارية، ولكي ترى أيضًا أخطاء الشبكة وأخطاء JS.

وأنصح أيضًا بهذه الإضافة التي تعرض أخطاء JS بشكل أوضح، حين تنسى أنت نفسك أن تنتبه لها:

3. JavaScript: قراءة إلزامية «You Don't Know JS»

• You Don't Know JS (1st Edition)
• يشرح لماذا يجب تجنّب this
• يشرح لماذا تحدث في JS أحيانًا أشياء تبدو غريبة (الكلمات المفتاحية: Lexical Scope، Closures)

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

• ضعها دائمًا
• ليست إلزامية، لكنها قد تساعد مثلًا على تجنّب هذا الفخ: Stack Overflow
• تضيف JavaScript الفاصلة المنقوطة تلقائيًا:

// you want to return 5 and have ugly formatting:
return
5

// JavaScript Interpretation:
return;
5;

5. العاملان المنطقيان && و||

• في Java يُقيَّم a && b وa || b وفق الجبر البولياني. ويجب أن يكون a وb من النوع Boolean.
• في JavaScript:
  • في a && b تُعاد b إذا كانت a صحيحة (true)
  • في a || b تُعاد b إذا كانت a خاطئة (false)

ويمكن ربط التعابير (Expressions) بهذه الطريقة أيضًا، مما يتيح أقصر جملة if على الإطلاق – سكر نحوي (Syntax Sugar):

• isAdmin && showDeleteButton();
• (وبدقة، لم تعد هذه جملة Statement)

ويُستخدم ذلك كثيرًا أيضًا للقيم الافتراضية:

• let sendNewsletter = form.getNewsletterOptIn() || false;

6. هل تمرّر JavaScript بالمرجع أم بالقيمة؟

الأمر مثير للاهتمام في JavaScript. مثال:

function changeStuff(a, b, c) {
    a = a * 10;
    b.item = "changed";
    c = {item: "changed"};
}

var num = 10;
var obj1 = {item: "unchanged"};
var obj2 = {item: "unchanged"};

changeStuff(num, obj1, obj2);

console.log(num);
console.log(obj1.item);
console.log(obj2.item);

ينتج المخرجات التالية:

10
changed
unchanged

لو لم يكن obj1 مرجعًا على الإطلاق، لما كان لتغيير obj1.item أي أثر على obj1 خارج الدالة.

ولو كان الوسيط مرجعًا حقيقيًا، لتغيّر كل شيء: لأصبحت num تساوي 100، ولاحتوت obj2.item على «changed». لكن بدلًا من ذلك تبقى num عند 10، وتبقى obj2.item بقيمة «unchanged».

في الواقع يُمرَّر العنصر بالقيمة. غير أن ما يُمرَّر بالقيمة هو نفسه مرجع. ويُسمّى هذا تقنيًا الاستدعاء بالمشاركة (call-by-sharing).

عمليًا يعني ذلك: إذا غيّرت المعامل نفسه (كما في num وobj2)، فلن يؤثر ذلك على الكائن الأصلي الذي مُرِّر إلى الدالة. أما إذا غيّرت القيم الداخلية للمعامل، فستنعكس هذه التغييرات (كما في obj1).