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

1. الأساسيات: حاول...التقط

لنبدأ بالمحاولة الكلاسيكية...التقاط:

try {
  const data = JSON.parse('{"name": "John"}');
  console.log(data.age.toUpperCase()); // This will cause an error
} catch (error) {
  console.error("Something went wrong:", error);
}

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

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

2. فهم أنواع الأخطاء الأصلية

يأتي جافا سكريبت مزودًا بأنواع الأخطاء المضمنة، مثل:

• خطأ: كائن الخطأ العام.
• خطأ في الكتابة: يتم طرحه عندما لا يكون المتغير من النوع المتوقع.
• خطأ في بناء الجملة: يتم طرحه عندما يحتوي الكود على خطأ في بناء الجملة.
• خطأ مرجعي: يتم طرحه عند الإشارة إلى متغير غير موجود.

مثال:

try {
  let result = myUndefinedFunction();
} catch (error) {
  if (error instanceof ReferenceError) {
    console.error("ReferenceError detected:", error.message);
  } else {
    console.error("Unexpected error:", error);
  }
}

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

3. إنشاء أخطاء مخصصة

لماذا الأخطاء المخصصة؟

تساعد الأخطاء المخصصة في تحديد مشكلات معينة داخل التعليمات البرمجية الخاصة بك، مما يسهل تصحيح الأخطاء كثيرًا. على سبيل المثال، إذا كنت تقوم بإنشاء واجهة برمجة التطبيقات (API)، فقد ترغب في التمييز بين ValidationError أو AuthenticationError أو DatabaseError.

كيفية إنشاء أخطاء مخصصة

لنقم بإنشاء خطأ التحقق كمثال:

class ValidationError extends Error {
  constructor(message) {
    super(message);
    this.name = "ValidationError";
  }
}

try {
  const age = -5;
  if (age 



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


  
  
  4. إثراء الأخطاء المخصصة بمزيد من المعلومات


لماذا تتوقف عند مجرد رسالة مخصصة؟ دعونا نثري خطأنا المخصص بخصائص إضافية مثل رمز الخطأ أو رمز الحالة.



class HttpError extends Error {
  constructor(statusCode, message) {
    super(message);
    this.name = "HttpError";
    this.statusCode = statusCode;
  }
}

try {
  const response = { status: 404 };
  if (response.status === 404) {
    throw new HttpError(404, "Resource not found");
  }
} catch (error) {
  if (error instanceof HttpError) {
    console.error(`Error ${error.statusCode}: ${error.message}`);
  } else {
    console.error("Unexpected error:", error);
  }
}




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


  
  
  5. بناء استراتيجية عالمية للتعامل مع الأخطاء


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



function handleError(error) {
  if (error instanceof ValidationError) {
    console.error("Validation failed:", error.message);
  } else if (error instanceof HttpError) {
    console.error(`HTTP error (${error.statusCode}):`, error.message);
  } else {
    console.error("An unexpected error occurred:", error);
  }
}

try {
  throw new HttpError(500, "Internal Server Error");
} catch (error) {
  handleError(error);
}




 تساعد معالجة الأخطاء المركزية هذه في الحفاظ على التعليمات البرمجية الخاصة بك جافة (لا تكرر نفسك) وتضمن معالجة الأخطاء بشكل متسق عبر تطبيقك.


  
  
  6. الاستفادة أخيرًا من عملية التنظيف


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



try {
  // Attempt to execute code
} catch (error) {
  // Handle errors
} finally {
  console.log("This will always execute, whether an error occurred or not.");
}




يضمن الاستخدام أخيرًا تنفيذ هذه الكتلة بغض النظر عما إذا كان قد تم إلقاء خطأ أم لا، مما يجعلها مثالية لعمليات التنظيف.


  
  
  7. التكامل مع خدمات التسجيل


بالنسبة لتطبيقات الإنتاج، من الضروري تسجيل الأخطاء. يمكن لخدمات مثل Sentry أو LogRocket أو Datadog التقاط الأخطاء من خلال تتبعات المكدس الكاملة، مما يجعل استكشاف الأخطاء وإصلاحها أسهل بكثير.

مثال:



import * as Sentry from '@sentry/browser';

Sentry.init({ dsn: 'YOUR_SENTRY_DSN' });

try {
  // Your code that might throw an error
} catch (error) {
  Sentry.captureException(error);
  handleError(error);
}




يوفر هذا التكامل رؤية أفضل للمشكلات ويساعدك على مراقبة صحة تطبيقك في الوقت الفعلي.


  
  
  الأفكار النهائية


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


  
  
  ما هي الخطوة التالية؟

• جرب الأخطاء المخصصة في مشروعك الحالي.
• تنفيذ معالج أخطاء مركزي.
• دمج خدمات تسجيل الأخطاء في تطبيقك.

أخبرني كيف تتعامل مع الأخطاء في مشاريعك، أو إذا كان لديك أي نصائح وحيل رائعة لمشاركتها!

هل استمتعت بهذه المشاركة؟ تابعني للحصول على المزيد من النصائح والحيل الخاصة بجافا سكريبت!