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

جزء من قسم مقدمة إلى TypeScript في رحلة JavaScript على Coddy. الدرس 72 من 73.

في بعض الأحيان، قد تحتاج إلى العمل مع كائنات (objects) حيث تعرف نوع القيم التي ستحتوي عليها، ولكنك لا تعرف أسماء الخصائص المحددة مسبقاً. هذا أمر شائع عند العمل مع القواميس (dictionaries) أو الخرائط (maps) أو كائنات التكوين (configuration objects) حيث تكون المفاتيح (keys) ديناميكية.

تسمح لك تواقيع الفهرسة (Index signatures) بتعريف بنية النوع لمثل هذه الكائنات. تستخدم الصيغة الأقواس المربعة لتحديد نوع المفتاح ونوع القيمة:

interface StringDictionary {
  [key: string]: number;
}

تنص هذه الواجهة على أن "أي مفتاح من نوع string سيكون له قيمة من نوع number". يمكنك بعد ذلك إنشاء كائنات تطابق هذا النمط:

let scores: StringDictionary = {
  "alice": 95,
  "bob": 87,
  "charlie": 92
};

تعد تواقيع الفهرس (Index signatures) مفيدة بشكل خاص لسيناريوهات مثل تخزين تفضيلات المستخدم، أو التخزين المؤقت للبيانات بمفاتيح ديناميكية، أو العمل مع استجابات واجهة برمجة التطبيقات (API) حيث لا تكون أسماء الخصائص معروفة في وقت التجميع (compile time). عادةً ما يكون نوع المفتاح هو string أو number، بينما يمكن أن يكون نوع القيمة أي نوع TypeScript صالح.

التحدي

سهل

قم بإنشاء واجهة (interface) لنظام كتالوج المنتجات حيث يتم تخزين فئات المنتجات وكميات مخزونها بشكل ديناميكي.

أنشئ واجهة تسمى ProductCatalog تستخدم توقيع الفهرس (index signature) لربط مفاتيح من نوع string (أسماء المنتجات) بقيم من نوع number (كميات المخزون).

أنشئ دالة تسمى getStockLevel تقوم بما يلي:

تأخذ معاملين: catalog من نوع ProductCatalog و productName من نوع string
تعيد كمية المخزون لاسم المنتج المحدد
تعيد 0 إذا كان المنتج غير موجود في الكتالوج
لها نوع إرجاع صريح هو number

أنشئ دالة تسمى updateStock تقوم بما يلي:

تأخذ ثلاثة معاملات: catalog من نوع ProductCatalog، و productName من نوع string، و newQuantity من نوع number
تحدث كمية المخزون للمنتج المحدد
تعيد void

أنشئ دالة تسمى getTotalStock تقوم بما يلي:

تأخذ معاملاً catalog من نوع ProductCatalog
تعيد مجموع كل كميات المخزون في الكتالوج
لها نوع إرجاع صريح هو number

أنشئ بيانات اختبار:

أنشئ inventory من نوع ProductCatalog مع المنتجات التالية:
- "laptop": 15
- "mouse": 50
- "keyboard": 25
- "monitor": 8

اختبر دوالك واطبع المخرجات التالية:

استدعِ getStockLevel مع inventory و "laptop"
استدعِ getStockLevel مع inventory و "tablet"
استدعِ getTotalStock مع inventory
استدعِ updateStock مع inventory و "mouse" و 75
استدعِ updateStock مع inventory و "webcam" و 12
استدعِ getStockLevel مع inventory و "mouse"
استدعِ getStockLevel مع inventory و "webcam"
استدعِ getTotalStock مع inventory

جرّب بنفسك

// TODO: اكتب كودك هنا

// أنشئ واجهة ProductCatalog


// أنشئ دالة getStockLevel


// أنشئ دالة updateStock


// أنشئ دالة getTotalStock


// أنشئ بيانات تجريبية - كائن inventory


// اختبر الدوال واطبع النتائج
console.log(getStockLevel(inventory, "laptop"));
console.log(getStockLevel(inventory, "tablet"));
console.log(getTotalStock(inventory));
updateStock(inventory, "mouse", 75);
updateStock(inventory, "webcam", 12);
console.log(getStockLevel(inventory, "mouse"));
console.log(getStockLevel(inventory, "webcam"));
console.log(getTotalStock(inventory));