TypeScript Academy · درس

دمج المفاتيح المعروفة والديناميكية

اخلطوا الخصائص الثابتة مع توقيعات الفهارس بأمان

الدرس 3 من 413 خطوة

دمج المفاتيح المعروفة والديناميكية درس مجاني في TypeScript Academy على CoddyKit. هذا هو الدرس 3 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في TypeScript Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة TypeScript Academy 4 دروس في المجموع.

ثابت ومرن معًا

غالبًا ما يضم الكائن بعض الخصائص المضمونة، بالإضافة إلى مجموعة مفتوحة النهاية من العناصر الإضافية. يتيح لكم TypeScript التصريح بالخصائص المسماة وبـ توقيع فهرسة في النوع نفسه — مع وجود قيد مهم واحد.

مفتاح معروف إلى جانب توقيع الفهرسة

تكون length موجودة دائمًا هنا، بينما يرتبط أي مفتاح نصي آخر بقيمة رقمية. وتتعايش الخاصية المسماة مع توقيع الفهرسة.

interface NumberMap {
  length: number
  [key: string]: number
}
const m: NumberMap = { length: 2, a: 1, b: 1 }
console.log(m.length, m.a)

قيد التوافق

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

interface Valid {
  id: number       // ok: number matches the signature
  [key: string]: number
}
const v: Valid = { id: 1, score: 99 }
console.log(v.id + v.score)

عند انتهاك القيد

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

// interface Broken {
//   name: string   // Error: string not assignable to number
//   [key: string]: number
// }

توسيع نوع قيمة الفهرس

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

interface Record {
  name: string
  [key: string]: string | number
}
const r: Record = { name: "ana", score: 10 }
console.log(r.name, r.score)

الخصائص الثابتة الاختيارية

يمكن أن تكون الخصائص الثابتة اختيارية باستخدام ?. ومع ذلك، يجب أن تظل متوافقة مع توقيع الفهرسة عند وجودها.

interface Config {
  id: string
  label?: string
  [key: string]: string | undefined
}
const c: Config = { id: "x" }
console.log(c.label) // undefined

سبب حاجة الاختياري إلى undefined

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

interface Safe {
  title?: string
  [key: string]: string | undefined
}
const s: Safe = {}
for (const k in s) console.log(s[k])

أنواع قيم مختلفة باستخدام الاتحادات

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

interface Settings {
  enabled: boolean
  theme: string
  [key: string]: boolean | string
}
const s: Settings = { enabled: true, theme: "dark", lang: "en" }
console.log(s.enabled, s.lang)

الفهرسة الرقمية مع مفاتيح معروفة

ينطبق القيد أيضًا على توقيعات الفهرسة الرقمية. إذ يجب أن تتطابق الخاصية الرقمية المسماة مع نوع قيمة الفهرس الرقمي.

interface Sparse {
  count: number
  [index: number]: number
}
const sp: Sparse = { count: 1, 0: 100, 1: 200 }
console.log(sp.count, sp[0])

بديل أكثر وضوحًا

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

interface Better {
  name: string
  scores: { [key: string]: number }
}
const b: Better = { name: "ana", scores: { math: 90 } }
console.log(b.name, b.scores.math)

متى ندمجهما

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

interface Tally {
  total: number
  [bucket: string]: number
}
const t: Tally = { total: 0, a: 3, b: 5 }
t.total = t.a + t.b
console.log(t.total) // 8

تحقق سريع

اختبروا فهمكم لخلط المفاتيح الثابتة والديناميكية.

مراجعة

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

البدء مجانًا

تعلم TypeScript مع معلم ذكاء اصطناعي — مجانًا

اكتب وقم بتشغيل أكوادك الفعلية في المتصفح، واحصل على مساعدة فورية من معلم ذكاء اصطناعي متاح 24/7، واستمر من حيث توقفت على الويب أو في التطبيق.

الدورات
101
الدروس
352

الأسئلة الشائعة

هل درس «دمج المفاتيح المعروفة والديناميكية» مجاني؟

نعم — نص درس «دمج المفاتيح المعروفة والديناميكية» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة TypeScript Academy، انتقل إلى CoddyKit PRO. تتضمن دورة TypeScript Academy 4 دروس في المجموع.

ماذا ستتعلم في «دمج المفاتيح المعروفة والديناميكية»؟

اخلطوا الخصائص الثابتة مع توقيعات الفهارس بأمان تتمرن على TypeScript Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ TypeScript Academy؟

لا تُشترط خبرة سابقة. TypeScript Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 3 من أصل 4.

كم من الوقت يستغرق درس «دمج المفاتيح المعروفة والديناميكية»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس TypeScript Academy هذا؟

نعم. كل درس في TypeScript Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. تعريف توقيعات الفهارس
  2. توقيعات فهارس السلاسل مقابل الأرقام
  3. دمج المفاتيح المعروفة والديناميكية
  4. توقيعات الفهارس مقابل Record
← العودة إلى TypeScript Academy