الأنواع العامة: T وextends والقيود
اكتب دوال وواجهات عامة، وقيّد معاملات الأنواع باستخدام extends، واستخدم القيم الافتراضية للأنواع العامة لإنشاء واجهات برمجية مرنة.
الأنواع العامة: T وextends والقيود درس مجاني في Frontend Academy على CoddyKit. هذا هو الدرس 1 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Frontend Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Frontend Academy 4 دروس في المجموع.
ما الأنواع العامة؟
تتيح لك الأنواع العامة كتابة دوال وفئات وواجهات تعمل مع أنواع متعددة مع الحفاظ على أمان الأنواع. وبدلاً من كتابة دوال منفصلة لكل نوع، تكتب دالة عامة واحدة مُعلَّمة بمعامل نوع.
دالة عامة بسيطة
يُصرَّح عن معامل النوع T بين قوسين زاويين. ويستنتج TypeScript قيمة T من نوع الوسيط، فلا حاجة إلى إضافة تعليق توضيحي صريح في موضع الاستدعاء.
function identity<T>(value: T): T {
return value;
}
identity(42); // T is inferred as number, returns number
identity('hello'); // T inferred as string
identity<boolean>(true); // explicitالواجهات والأنواع العامة
أضف معاملات عامة إلى الواجهات والأنواع لوصف هياكل بيانات قابلة لإعادة الاستخدام.
interface Box<T> {
value: T;
label?: string;
}
const numBox: Box<number> = { value: 42 };
const strBox: Box<string> = { value: 'hello', label: 'greeting' };extends — تقييد الأنواع العامة
استخدم T extends SomeType لتقييد القيم التي يمكن أن يأخذها T. فلا تقبل الدالة إلا الأنواع التي تستوفي القيد.
function getLength<T extends { length: number }>(item: T): number {
return item.length; // safe: T is guaranteed to have length
}
getLength('hello'); // 5
getLength([1, 2, 3]); // 3
getLength({ length: 7 }); // 7
// getLength(42); // Error: number has no lengthkeyof وقيود الأنواع العامة
ينتج keyof T اتحادًا من مفاتيح خصائص T. وبالاقتران مع الأنواع العامة، يتيح الوصول الآمن إلى الخصائص من حيث النوع.
function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
return obj[key];
}
const user = { name: 'Alice', age: 30 };
getProperty(user, 'name'); // string
getProperty(user, 'age'); // number
// getProperty(user, 'foo'); // Errorالقيم الافتراضية للأنواع العامة
وفّر نوعًا افتراضيًا لمعامل عام باستخدام T = DefaultType. ويُستخدم ذلك عند وجود قيمة افتراضية مناسبة، مع إتاحة استبدالها من قِبل المستدعين.
interface Paginated<T = unknown> {
items: T[];
total: number;
page: number;
}
const rawPage: Paginated = { items: [], total: 0, page: 1 };
const typedPage: Paginated<User> = { items: [], total: 0, page: 1 };معاملات أنواع متعددة
يمكن أن تحتوي الدوال على معاملات أنواع متعددة ومستقلة.
function zip<A, B>(arrA: A[], arrB: B[]): Array<[A, B]> {
return arrA.map((a, i) => [a, arrB[i]]);
}
zip([1, 2, 3], ['a', 'b', 'c']);
// [[1,'a'], [2,'b'], [3,'c']]الفئات العامة
يمكن أن تكون الفئات عامة أيضًا. وهذا شائع في هياكل البيانات مثل المكدسات والطوابير ومخازن البيانات القابلة للرصد.
class Stack<T> {
private items: T[] = [];
push(item: T) { this.items.push(item); }
pop(): T | undefined { return this.items.pop(); }
peek(): T | undefined { return this.items.at(-1); }
get size() { return this.items.length; }
}
const stack = new Stack<number>();
stack.push(1);
stack.push(2);
stack.pop(); // 2الدوال العامة غير المتزامنة
تشيع الدوال العامة غير المتزامنة في استدعاءات API المقيّدة بالأنواع.
async function fetchJson<T>(url: string): Promise<T> {
const res = await fetch(url);
if (!res.ok) throw new Error(`HTTP ${res.status}`);
return res.json() as Promise<T>;
}
const users = await fetchJson<User[]>('/api/users');
const profile = await fetchJson<UserProfile>('/api/me');Infer في الأنواع الشرطية
تستخرج الكلمة المفتاحية infer داخل النوع الشرطي نوعًا من نمط معين. وتُستخدم في شفرة المكتبات لاستخراج نوع القيمة المعادة لدالة أو نوع عناصر مصفوفة.
type ReturnType<T> = T extends (...args: any[]) => infer R ? R : never;
type ElementType<T> = T extends Array<infer E> ? E : never;
type Fn = () => { name: string };
type Result = ReturnType<Fn>; // { name: string }متى تُستخدم الأنواع العامة؟
استخدم الأنواع العامة عندما: 1) تنطبق المنطقية نفسها على أنواع متعددة، 2) تحتاج إلى علاقة بين أنواع الإدخال والإخراج، 3) تنشئ هيكل بيانات أو أداة قابلة لإعادة الاستخدام. لا تستخدم الأنواع العامة لمجرد استخدامها — فالأنواع الملموسة أوضح عندما تكون هناك حالة استخدام واحدة فقط.
تحقق سريع
ماذا يضمن القيد T extends { length: number }؟
مراجعة: الأنواع العامة
تُعلّم الأنواع العامة الأنواعَ بمعاملات، بحيث تعمل دالة أو فئة أو واجهة واحدة مع أنواع متعددة. ويضيف T extends SomeType قيودًا. ويعطي keyof T اتحادات مفاتيح الخصائص. وتوفّر القيم الافتراضية العامة باستخدام T = Default. وتستخرج infer الأنواع في الأنواع الشرطية. استخدم الأنواع العامة للأدوات وهياكل البيانات المقيّدة بالأنواع والقابلة لإعادة الاستخدام.
الأسئلة الشائعة
هل درس «الأنواع العامة: T وextends والقيود» مجاني؟
نعم — نص درس «الأنواع العامة: T وextends والقيود» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Frontend Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Frontend Academy 4 دروس في المجموع.
ماذا ستتعلم في «الأنواع العامة: T وextends والقيود»؟
اكتب دوال وواجهات عامة، وقيّد معاملات الأنواع باستخدام extends، واستخدم القيم الافتراضية للأنواع العامة لإنشاء واجهات برمجية مرنة. تتمرن على Frontend Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.
هل أحتاج إلى خبرة سابقة لأبدأ Frontend Academy؟
لا تُشترط خبرة سابقة. Frontend Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 1 من أصل 4.
كم من الوقت يستغرق درس «الأنواع العامة: T وextends والقيود»؟
معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.
هل يمكنني كتابة وتشغيل أكواد في درس Frontend Academy هذا؟
نعم. كل درس في Frontend Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.
جميع الدروس في هذه الدورة
- الأنواع العامة: T وextends والقيود
- أنواع الأدوات: Partial وRequired وPick وOmit
- الأنواع المعتمدة على التعيين والأنواع الشرطية
- تضييق الأنواع: typeof وinstanceof والاتحادات المميّزة