كود نظيف في TypeScript: المبادئ والأمثلة العملية

كود نظيف في TypeScript: المبادئ والأمثلة العملية

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

1. التسمية: قل ما يفعله المتغير

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

مثال سيء:

const d = new Date();\nconst arr = [1, 2, 3];\nfunction proc(x: number, y: number) {\n    return x * y;\n}

مثال جيد:

const currentDate = new Date();\nconst userScores: number[] = [1, 2, 3];\nfunction calculateArea(width: number, height: number): number {\n    return width * height;\n}

استخدم الأسماء للمتغيرات والأفعال للدوال. تجنب الاختصارات (باستثناء الشائعة مثل id أو url). TypeScript يسمح بإضافة الأنواع، لكن الاسم يجب أن يعكس الجوهر.

2. الدوال: صغيرة ونظيفة وقابلة للتنبؤ

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

مبدأ المسؤولية الواحدة (SRP) على مستوى الدوال:

// سيء: الدالة تفعل كل شيء مرة واحدة\nfunction processUserData(user: User): void {\n    // التحقق\n    if (!user.email) throw new Error('Email required');\n    // الحفظ في قاعدة البيانات\n    database.save(user);\n    // إرسال البريد الإلكتروني\n    emailService.sendWelcome(user.email);\n}\n\n// جيد: تقسيم المسؤوليات\nfunction validateUser(user: User): boolean {\n    return user.email !== undefined;\n}\n\nfunction saveUser(user: User): void {\n    database.save(user);\n}\n\nfunction sendWelcomeEmail(email: string): void {\n    emailService.send(email);\n}\n\nfunction processUser(user: User): void {\n    if (!validateUser(user)) {\n        throw new Error('Invalid user data');\n    }\n    saveUser(user);\n    sendWelcomeEmail(user.email);\n}

تجنب أيضًا كثرة المعاملات. إذا كان هناك أكثر من اثنين، قم بدمجها في كائن:

// سيء\nfunction createUser(name: string, email: string, age: number, isAdmin: boolean): void {}\n\n// جيد\ninterface CreateUserParams {\n    name: string;\n    email: string;\n    age: number;\n    isAdmin: boolean;\n}\n\nfunction createUser(params: CreateUserParams): void {}

3. كتابة الأنواع: استخدم إمكانيات TypeScript بالكامل

واحدة من المزايا الرئيسية لـ TypeScript هي الكتابة الصارمة للأنواع. لكن العديد من المطورين يستخدمون any كعكاز، مما يقتل الفائدة كلها. الكود النظيف في TypeScript هو الكود الذي تكون فيه الأنواع موصوفة بوضوح، وليست مخمنة.

تجنب any:

// سيء\nfunction getData(): any {\n    return fetch('/api/data');\n}\n\n// جيد\ninterface ApiResponse {\n    id: number;\n    title: string;\n}\n\nasync function getData(): Promise<ApiResponse> {\n    const response = await fetch('/api/data');\n    return response.json();\n}

استخدم الاتحادات المميزة (discriminated unions) للحالات المعقدة:

// سيء: غير واضح ما في الكائن\ntype Status = 'loading' | 'success' | 'error';\n\ninterface State {\n    status: Status;\n    data?: Data;\n    error?: string;\n}\n\n// جيد: كل