كيفية التحقق من null و undefined في TypeScript: الأخطاء والحلول الأفضل

تعلم Python بسهولة دون إرهاق نظري. حل مهام عملية مع التحقق التلقائي واكتب الكود مباشرة في المتصفح.

مقدمة: لماذا قد يخذلكم "if (value)" البسيط؟

كل مطور ينتقل من JavaScript إلى TypeScript سيواجه عاجلاً أم آجلاً هذا السؤال: "هل توجد طريقة للتحقق من كل من null و undefined؟". هذا السؤال حصد آلاف المشاهدات على Stack Overflow - وليس من دون سبب. للوهلة الأولى، تبدو المهمة تافهة: كتابة if (value != null) أو if (value). لكن الشيطان، كما هو الحال دائماً، يكمن في التفاصيل.

في هذه المقالة، سنحلل أهم الأخطاء التي يرتكبها المبتدئون (وليس فقط هم) عند التحقق من null و undefined في TypeScript. ستتعرفون على لماذا يمكن أن تكون المقارنة غير الصارمة أكثر خطورة مما تبدو، وكيف يعمل عامل الدمج اللاشيئي (??) ومتى يجب استخدام حماية الأنواع المخصصة. هيا بنا!

الخطأ رقم 1: استخدام `if (!value)` لجميع القيم الخاطئة

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

// ❌ سيءfunction processInput(input: string | null | undefined) {  if (!input) {    console.log('الإدخال مفقود');    return;  }  console.log(input.toUpperCase());}

processInput(''); // ❌ سيظهر "الإدخال مفقود"، على الرغم من أن السلسلة فارغة، لكنها ليست null وليست undefined

المشكلة هي أن !value يحول أي قيمة خاطئة إلى true. في TypeScript (و JavaScript) تعتبر القيم التالية خاطئة: false، 0، '' (سلسلة فارغة)، NaN، null، undefined. إذا كان منطق عملك يسمح بسلسلة فارغة أو الرقم 0، فسيتعطل هذا الكود.

كيف تتجنبه: استخدم التحقق الصارم من null و undefined من خلال === أو !==.

الخطأ رقم 2: الثقة العمياء بـ `value == null`

يعرف العديد من المطورين أن value == null (علامة المساواة المزدوجة) يتحقق من كل من null و undefined في نفس الوقت. هذا يعمل بالفعل:

// ✅ يعمل، لكن...function check(value: string | null | undefined) {  if (value == null) {    console.log('القيمة هي null أو undefined');  }}

ومع ذلك، فإن علامة المساواة المزدوجة في TypeScript هي مصدر أخطاء غير واضحة. على سبيل المثال، null == undefined هو true، لكن null == false هو false. وماذا عن '' == false؟ أيضاً true. يمكن أن تتصرف المقارنة غير الصارمة بشكل غير متوقع، خاصة في الشروط المعقدة.

كيف تتجنبه: في TypeScript، value == null هو نمط مسموح به رسمياً (غالباً ما يسمح به المدقق)، لكن للمبتدئين من الأفضل الالتزام بالنهج الصريح: value === null || value === undefined.

الخطأ رقم 3: تجاهل `undefined` عند العمل مع الكائنات

أحياناً يتحقق المطورون من null فقط، متناسين undefined:

// ❌ خطيرinterface User {  name?: string;  age: number | null;}

function greet(user: User) {  if (user.age !== null) {    console.log(`العمر: ${user.age}`);  }  // إذا لم يتم تمرير age (undefined)، سيتم تنفيذ الكود!}

greet({ name: 'Alice' }); // سيظهر "العمر: undefined"

يمكن أن يكون الحقل age إما null أو number أو undefined (إذا لم يتم تحديده في الواجهة). التحقق من null فقط يتجاهل undefined.

كيف تتجنبه: تحقق دائماً من كلا القيمتين إذا كان النوع يسمح بكليهما. أو استخدم عامل الربط الاختياري (?.) و عامل الدمج اللاشيئي (??).