الدوال في TypeScript

تشرح هذه المقالة الدوال في TypeScript۔

YouTube Video

الدوال في TypeScript

الدوال في TypeScript هي دوال JavaScript مع تعليقات أنواع إضافية۔ في TypeScript، يمكنك كتابة كود أكثر قوة من خلال تحديد أنواع المدخلات (المعاملات) والمخرجات (قيم الإرجاع) للدوال بوضوح۔ فيما يلي، نستعرض الطرق الأساسية لتعريف الدوال وبعض خصائص الدوال في TypeScript۔

تعريف الدوال الأساسية

1function add(x: number, y: number): number {
2    return x + y;
3}
4
5console.log(add(5, 10));  // 15

• تأخذ الدالة add وسيطين من النوع number وتعيد قيمة من النوع number۔
• تأخذ وسيطين، x و y، وكلاهما من النوع number مع تحديد نوعيهما بشكل صريح۔
• تم تحديد نوع القيمة المرجعة أيضاً كـ : number۔

الدوال المجهولة (التعبيرات الدالية)

يمكن أيضًا استخدام الدوال المجهولة والتعبيرات الدالية في TypeScript۔ يمكن تعليق الأنواع بنفس الطريقة۔

1const multiply = function (x: number, y: number): number {
2    return x * y;
3};
4
5console.log(multiply(3, 4));  // 12

• يمكنك تعيين دالة مجهولة إلى متغير واستدعائها لاحقاً۔

1const factorial = function fact(n: number): number {
2  if (n <= 1) return 1;
3  return n * fact(n - 1); // Can call itself recursively
4};
5
6console.log(factorial(5)); // 120

• يمكنك استخدام تعبير دالة مسمى لتمكين الاستدعاء الذاتي (التكراري)۔

الدوال السهمية

يمكن استخدام تعليقات الأنواع مع الدوال السهمية أيضًا۔

1const subtract = (x: number, y: number): number => {
2    return x - y;
3};
4
5console.log(subtract(10, 4));  // 6

يقوم هذا الكود بتعريف دالة سهمية subtract مع تعليقات نوعية تأخذ عددين كوسيطين وتعيد الفرق بينهما۔

المعاملات الاختيارية والقيم الافتراضية

يمكن جعل المعاملات اختيارية أو إعطاؤها قيمًا افتراضية۔

المعاملات الاختيارية

إضافة ? بعد اسم المعامل يجعله اختياريًا۔

1function greet(name?: string): string {
2    return name ? `Hello, ${name}` : "Hello!";
3}
4
5console.log(greet());        // Hello!
6console.log(greet("Alice"));  // Hello, Alice

يقبل هذا الكود وسيطاً اختيارياً؛ إذا تم توفير الوسيط، يرحب باستخدام الاسم، وإلا فإنه يعرض تحية عامة۔

المعاملات ذات القيم الافتراضية

يمكنك أيضًا تعيين قيم افتراضية للمعاملات۔

1function greetWithDefault(name: string = "Guest"): string {
2    return `Hello, ${name}`;
3}
4
5console.log(greetWithDefault());         // Hello, Guest
6console.log(greetWithDefault("Bob"));    // Hello, Bob

تستخدم هذه الدالة "Guest" كقيمة افتراضية إذا لم يتم تمرير أي وسيط، وترحب بالاسم المحدد أو الافتراضي۔

تعريف نوع الدالة

من الممكن أيضًا تعريف نوع الدالة نفسها۔ على سبيل المثال، يتم استخدام ذلك عند تمرير دالة كمعامل۔

1type Operation = (x: number, y: number) => number;
2
3const addOperation: Operation = (x, y) => x + y;
4const multiplyOperation: Operation = (x, y) => x * y;
5
6console.log(addOperation(2, 3));      // 5
7console.log(multiplyOperation(2, 3)); // 6

يقوم هذا الكود بتعريف نوع دالة Operation تأخذ عددين وتعيد عدداً، ثم يستخدمه لإنشاء وتشغيل دوال الجمع والضرب۔

عندما لا توجد قيمة إرجاع (من النوع void)

بالنسبة للوظائف التي لا تحتوي على قيمة مُرجعة، حدد النوع void۔

1function logMessage(message: string): void {
2    console.log(message);
3}
4
5logMessage("This is a message.");  // This is a message.

يقوم هذا الكود بتعريف دالة void باسم logMessage تأخذ رسالة من نوع سلسلة نصية وتطبعها في وحدة التحكم دون إرجاع أي قيمة۔

دالة الاستدعاء (Callback Function)

تمرير دالة كوسيط إلى دالة أخرى وتنفيذها لاحقًا يُسمى دالة الاستدعاء (callback function)۔ يتم استخدامها بشكل متكرر في المعالجة غير المتزامنة والتعامل مع الأحداث۔

1function processData(callback: (data: string) => void): void {
2    const data: string = "Processed Data";
3    callback(data);
4}
5
6processData((result: string): void => {
7    console.log(result);
8});

في هذا المثال، يتم تمرير دالة تقوم بإخراج قيمة إلى وحدة التحكم كدالة استدعاء۔

بدلاً من ذلك، يمكنك تعريف نوع دالة الاستدعاء باستخدام type أو interface۔

 1type Callback = (data: string) => void;
 2
 3function processData(callback: Callback): void {
 4    const data: string = "Processed Data";
 5    callback(data);
 6}
 7
 8processData((result: string): void => {
 9    console.log(result);
10});

تعريف نوع دالة الاستدعاء باستخدام type أو interface يعزز إمكانية إعادة الاستخدام۔

زيادة التحميل على الدوال

تسمح لك زيادة التحميل على الدوال (Function overloading) بتعريف دوال بنفس الاسم ولكن بقوائم معاملات مختلفة.۔ في TypeScript، يمكنك تعريف وظائف متعددة بنفس الاسم وإجراء عمليات مختلفة بناءً على أنواع وعدد الوسائط۔

 1// Overload Signature
 2function double(value: number): number;
 3function double(value: string): string;
 4
 5// Implementation Signature
 6function double(value: number | string): number | string {
 7    if (typeof value === "number") {
 8        return value * 2;
 9    } else if (typeof value === "string") {
10        return value + value;
11    }
12}
13
14console.log(double(10));      // 20
15console.log(double("Hello")); // HelloHello

في TypeScript، يتم تحقيق التحميل الزائد على النحو التالي:۔

• توقيع التحميل الزائد

  • يحدد كيفية استخدام الوظيفة (توقيعها).۔ من خلال كتابة هذا التوقيع عدة مرات، يصبح التحميل الزائد ممكنًا.۔

• توقيع التنفيذ

  • ينفذ الجسم الفعلي للوظيفة.۔ يتم تعريف هذا الجزء مرة واحدة فقط ويتعامل مع جميع الحالات المصرح بها في توقيعات التحميل الزائد.۔

قواعد التحميل الزائد

تُطبق القواعد التالية على التحميل الزائد على الوظائف:۔

• ترتيب تعريفات توقيعات التحميل الزائد

  • نظرًا لأن التقييم يحدث من الأعلى إلى الأسفل، يُوصى بتعريف الأنواع المحددة أولاً، ثم الأنواع الأكثر عمومية.۔

• توافق توقيع التنفيذ

  • يجب أن يكون توقيع التنفيذ متوافقًا مع المعاملات وقيم الإرجاع لجميع توقيعات التحميل الزائد.۔

• حدد التفاصيل في توقيعات التحميل الزائد

  • يميل توقيع التنفيذ إلى الغموض، لذا يجب تحديد التفاصيل في توقيعات التحميل الزائد.۔
  • إذا تم تعريف توقيع التنفيذ فقط، فسيكون استنتاج النوع للوظيفة غير كافٍ.۔

الملخص

تتميز الدوال في TypeScript بالخصائص التالية۔

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

باستخدام هذه الميزات، يمكنك كتابة شفرة أكثر وضوحاً وقوة في TypeScript۔

يمكنك متابعة المقالة أعلاه باستخدام Visual Studio Code على قناتنا على YouTube.۔ يرجى التحقق من القناة على YouTube أيضًا.۔

YouTube Video