تخطَّ إلى المحتوى

🔷 شرح TypeScript

مقدمة في TypeScript

الدرس 1 من 28· ⏱ 2 دقائق قراءة· 🗓 آخر تحديث: ١ يوليو ٢٠٢٦

ما هي TypeScript؟

TypeScript هي JavaScript مع إضافة الأنواع (Types). طوّرتها مايكروسوفت لتكتشف الأخطاء قبل تشغيل البرنامج، لا بعده.

كل كود JavaScript صحيح هو كود TypeScript صحيح — TypeScript مجرد طبقة أمان فوق JavaScript.

لماذا TypeScript؟

  • تكتشف الأخطاء مبكرًا: المحرّر ينبّهك قبل التشغيل.
  • إكمال تلقائي ذكي: يقترح لك الخصائص والدوال المتاحة.
  • معيار الصناعة: معظم مشاريع React و Node.js الكبيرة تستخدمها.

أين تُستخدم TypeScript؟

  • تطبيقات الويب الكبيرة: حيث يعمل فريق كامل على نفس الكود.
  • مشاريع React وNext.js: صارت الخيار الافتراضي.
  • خوادم Node.js: لبناء واجهات برمجية آمنة الأنواع.

مثال يوضّح الفكرة

// JavaScript: لا أحد يمنعك من هذا الخطأ
let age = 25;
age = "خمسة وعشرون"; // يعمل... ثم ينهار لاحقًا

// TypeScript: يكتشف الخطأ فورًا
let age: number = 25;
age = "خمسة وعشرون"; // ❌ خطأ: Type 'string' is not assignable to 'number'

دالة بأنواع واضحة

function add(a: number, b: number): number {
  return a + b;
}

add(2, 3);      // ✅ 5
add(2, "3");    // ❌ خطأ قبل التشغيل

الأنواع تجعل نيّة الكود واضحة، وتمنع فئة كاملة من الأخطاء الشائعة.

كيف تشغّلها؟

TypeScript تُترجَم (compile) إلى JavaScript عادية:

npm install -g typescript
tsc file.ts      # ينتج file.js

أخطاء شائعة للمبتدئين

  • توقّع أنّ TypeScript تعمل في المتصفّح مباشرة (لا بدّ من الترجمة أولًا).
  • الإفراط في استخدام النوع any الذي يُلغي فائدة الأنواع.
  • نسيان تعريف نوع القيمة المُعادة من الدوال المهمّة.

أسئلة شائعة

هل أتعلّم JavaScript قبل TypeScript؟ نعم، TypeScript امتداد لجافاسكريبت، فلا بدّ من إتقان أساسياتها أولًا.

هل TypeScript أصعب من JavaScript؟ تضيف مفاهيم الأنواع فقط، لكنها في المقابل تجعل الأخطاء أوضح والكود أسهل صيانة.

🎯 التالي: الأنواع الأساسية — حجر الأساس في TypeScript.

شرح مقدمة في TypeScript — TypeScript بالعربي
مقدمة في TypeScriptTypeScript بالعربي · The Code Fix

📚 لمزيد من التعمّق في TypeScript، راجِع التوثيق الرسمي لـ TypeScript.

هل كان هذا الدرس مفيدًا؟