Clean Code على TypeScript: المبادئ والأمثلة للمطورين

مدرب بايثون أونلاين للمبتدئين

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

ابدأ الدورة

Clean Code على TypeScript: المبادئ والأمثلة



في تطوير الويب الحديث، أصبح TypeScript المعيار الفعلي لبناء تطبيقات كبيرة وموثوقة. ومع ذلك، فإن TypeScript في حد ذاته لا يضمن جودة الكود. لكي يظل المشروع مرنًا وواضحًا وسهل الصيانة، من الضروري اتباع مبادئ Clean Code. في هذه المقالة، سنشرح المفاهيم الأساسية للكود النظيف على TypeScript مع أمثلة توضيحية. ستتعلم كيفية كتابة كود يسعد ليس فقط المترجم (compiler) ولكن أيضًا زملاءك في العمل.



لماذا تعتبر Clean Code مهمة لـ TypeScript؟



يضيف TypeScript إلى JavaScript نظامًا ثابتًا للأنواع (static typing)، مما يساعد بالفعل في تجنب العديد من الأخطاء. لكن الأنواع هي مجرد أداة. بدون بنية مدروسة وأسلوب قابل للقراءة، يتحول الكود إلى "سباغيتي". Clean Code هي فلسفة تجعل الكود:

  • قابلاً للقراءة — أي مطور سيفهم المنطق بسرعة.
  • قابلاً للصيانة — التغييرات في مكان واحد لا تعطل التطبيق بأكمله.
  • قابلاً للتوسع — إضافة ميزات جديدة لا تتطلب إعادة كتابة نصف المشروع.

تطبيق هذه المبادئ في TypeScript يسمح باستخدام قوة نظام الأنواع (type system) على أكمل وجه، مما ينشئ كودًا يوثق نفسه بنفسه.



المبدأ 1: تسمية المتغيرات والدوال



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



مثال سيء:

// ما هو d؟ و y؟const d = new Date();const y = d.getFullYear();const fn = (a: number, b: number) => a + b;


مثال جيد:

const currentDate = new Date();const currentYear = currentDate.getFullYear();

const sum = (firstNumber: number, secondNumber: number): number => { return firstNumber + secondNumber;};


نصيحة: استخدم أسماء ذات معنى. للقيم المنطقية (boolean)، استخدم البادئات is، has، should. على سبيل المثال: isActive، hasPermission.



المبدأ 2: يجب أن تكون الدوال صغيرة وتقوم بشيء واحد



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



مثال سيء (الدالة تفعل كل شيء مرة واحدة):

function processUserData(user: any) {    // التحقق (Validation)    if (!user.email || !user.name) {        throw new Error('Invalid user');    }    // التنسيق (Formatting)    const formattedUser = {        fullName: user.name.toUpperCase(),        emailDomain: user.email.split('@')[1]    };    // الحفظ في قاعدة البيانات    database.save(formattedUser);    // إرسال البريد الإلكتروني    emailService.sendWelcomeEmail(formattedUser);}


مثال جيد (فصل المسؤوليات):

function validateUser(user: User): void {    if (!user.email || !user.name) {        throw new Error('Invalid user data');    }}

function formatUser(user: User): FormattedUser { return { fullName: user.name.toUpperCase(), emailDomain: user.email.split('@')[1] };}

async function processUserData(user: User): Promise<void> { validateUser(user); const formattedUser = formatUser(user); await database.save(formattedUser); await emailService.sendWelcomeEmail(formattedUser);}


كل دالة الآن لها هدف واحد واضح، ومن السهل اختبارها بشكل منفصل.



المبدأ 3: استخدم الأنواع (Types) والواجهات (Interfaces) للتوثيق الذاتي



يوفر TypeScript أدوات قوية لوصف البيانات. لا تفرط في استخدام النوع any — فهو يقتل كل فائدة من النظام الثابت للأنواع (static typing). قم بتعريف واجهة (interface)

المدونات

توصيات الكتب