5.1Node.js مع TypeScript
الأساسي في 30 ثانية
- TS = JS + الأنواع : مجموعة عليا من JavaScript — كل JS صالح هو TS صالح، ونضيف فوقه التنميط (typing) الساكن.
- أخطاء قبل التنفيذ : المترجم يتحقق من الأنواع ويمسك فئة كاملة من الأخطاء عند الترجمة، لا في الإنتاج.
- الأدوات والفريق : إكمال تلقائي دقيق، وإعادة هيكلة آمنة، وشيفرة توثق نفسها — حاسم في المشاريع الجادة.
حالة مصغرة متسلسلة — ساليم ينمّط واجهته في الجزائر
ساليم، مطور مبتدئ في الجزائر، يصون واجهة صغيرة لتتبع الطلبات : حقل « الكمية » يصل أحيانا نصا، واسم خاصية مكتوب خطأ يُسقط مسارا في الإنتاج. يُدخل TypeScript تدريجيا : يعلّم دواله، ويعرّف واجهة (interface) لبياناته، ويدع المترجم يمسك التناقضات قبل التنفيذ. هذا القسم يروي تحوله — ويستمر الخيط في 5.2 و5.3 و5.4.
هذه الحالة نفسها تعود في الدرس والمخطط والنص الجاهز وتحدي 48 ساعة — وتستمر في 5.2 و5.3 و5.4.
1. مجموعة عليا منمّطة
TypeScript هو مجموعة عليا من JavaScript تضيف التنميط (typing) الساكن : كل JavaScript صالح هو TypeScript صالح، والأنواع تُصرَّح فوقه (let age: number، function f(nom: string): string). TypeScript يتحقق من الاتساق قبل التنفيذ (عند الترجمة) ويمسك أخطاء لا تكشفها JavaScript، ذات التنميط الديناميكي، إلا عند التشغيل : نوع غير متوافق، وخاصية غير موجودة، ووسيط ناقص. يجد ساليم فيها كل JavaScript خاصته — مع شبكة أمان إضافية.
قاعدة الترتيب : JavaScript أولا، والأنواع فوقها. لا يُنمَّط جيدا إلا ما يُفهَم : الأنواع تصف بنى ودوال JavaScript متقَنة أصلا. يرسّخ ساليم JS خاصته (المستوى 1)، ثم يعلّم.
2. الترجمة والفوائد
TypeScript لا يُنفَّذ مباشرة : بل يُترجَم إلى JavaScript عادي (ملفات .ts ← .js عبر tsc، مضبوطا بـ tsconfig.json ؛ وts-node ينفذه في التطوير). الفوائد : كشف الأخطاء عند الترجمة، وإكمال تلقائي وأدوات متفوقة في المحرر، وتوثيق ضمني (الأنواع تصف الشيفرة)، ومتانة وقابلية صيانة في المشاريع الكبيرة ومع الفريق. يُعيد ساليم الهيكلة دون خوف : المترجم يشير إلى ما ينكسر في مكان آخر.
شبه معيار في Node الاحترافي، وممتاز مع الأدوات الحديثة المنمطة (Prisma، Zod). والكلفة موجودة — تعلم نظام الأنواع، وخطوة الترجمة، وبعض الإسهاب الذي يخففه الاستدلال — لكن في تطبيق جاد، الحساب رابح إلى حد كبير.
3. تدريجي، لا الكل أو لا شيء
TypeScript يُتعلَّم تدريجيا : تنميط خفيف في البداية (تعليقات بسيطة)، ثم واجهات وأنواع متقدمة. والاستدلال يخمّن الأنواع غالبا دون كتابتها — لا حاجة لتعليم كل شيء. ولسكربت صغير جدا للرمي، يكفي JavaScript الخالص ؛ ولتطبيق يكبر أو يدوم أو يُبنى مع فريق، يستحق TypeScript الجهد. يبدأ ساليم بتنميط بنى بياناته (نوع Commande) ومرتجعات دواله.
مما يُتجنَّب : تعلم TypeScript دون قاعدة JavaScript متينة (تعلُّمان مختلطان)، أو فرض التنميط الصارم في كل مكان من اليوم الأول. الإيقاع الجيد : تعليم الأساسي، وترك الباقي للاستدلال، ثم التشديد لاحقا.
🔎 مثال ملموس — ساليم يمسك خطأ قبل الإنتاج
خطأ نوعي مكتشَف عند الترجمة.
interface Commande { article: string; quantite: number; }
function total(c: Commande): number {
return c.quantite * 2;
}
total({ article: 'câble', quantite: '3' });
// ❌ TS : يجب أن يكون 'quantite' من نوع number — ممسوك قبل التنفيذالقراءة : في JavaScript الخالص، لا يظهر الخطأ إلا عند التشغيل — بل في الإنتاج أحيانا.
الدرس : فئة كاملة من الأخطاء تُقصى أثناء الكتابة نفسها.
مفردات القسم
- TypeScript
- مجموعة عليا من JavaScript تضيف التنميط الساكن ؛ تُترجَم إلى JS عادي.
مثال بسيط: ينمّط ساليم واجهة طلباته في الجزائر دون إعادة كتابة منطقه.
ما ليس كذلك: لغة مختلفة يجب تعلمها على حدة.
رد فعل: JS خاصتي يعمل أصلا ؟ أضيف الأنواع فوقه.
- التنميط الساكن
- أنواع مصرَّحة ومتحقَّق منها قبل التنفيذ، عند الترجمة.
مثال بسيط: كمية نصية يُشار إليها قبل أي نشر.
ما ليس كذلك: تحقق لا يقع إلا عند التشغيل.
رد فعل: هل سيكون هذا الخطأ مرئيا قبل الإنتاج ؟
- الترجمة (tsc)
- المترجم يتحقق من الأنواع ثم يحوّل ملفات .ts إلى .js.
مثال بسيط: يطلق ساليم tsc : صفر خطأ، وملف .js مولَّد.
ما ليس كذلك: تنفيذ مباشر لملف .ts بـ Node دون خطوة.
رد فعل: هل ضُبط tsconfig.json قبل الترجمة ؟
- الاستدلال
- TypeScript يخمّن الأنواع غالبا دون تعليق صريح.
مثال بسيط: لا يعلّم ساليم كل متغير محلي، فـ TS يستنتجها.
ما ليس كذلك: وجوب تعليم كل شيء في كل مكان.
رد فعل: هل يحتاج هذا النوع إلى كتابة، أم هو مُخمَّن ؟
- الاعتماد التدريجي
- تنميط خفيف أولا، ثم أنواع متقدمة، مع إعادة استعمال JS خاصتك.
مثال بسيط: ينمّط ساليم بناه ثم يشدد عبر الأسابيع.
ما ليس كذلك: تنميط كل شيء بالصارم من اليوم الأول.
رد فعل: ما أصغر تنميط مفيد هذا الأسبوع ؟
في التطبيق — تنميط الواجهة الخلفية بـ TypeScript
- اضبطوا مشروع TypeScript (tsconfig.json) ونفذوا ملف .ts في التطوير (ts-node أو الدعم الأصلي).
- علّموا الأنواع : متغيرات (`let age: number`)، ووسائط الدوال ومرتجعاتها (`function f(x: string): number`).
- لاحظوا كشف الأخطاء عند الترجمة : مرروا نوعا خاطئا، وادخلوا خاصية غير موجودة — ينبهكم TypeScript قبل التنفيذ.
- قدّروا الإكمال التلقائي والأدوات في VS Code ؛ وأدخلوا واجهات وأنواعا لبنى بياناتكم (مثلا نوع Commande).
نص جاهز للقول — اقتراح TypeScript على الفريق
« في واجهتنا في الجزائر، أقترح إدخال TypeScript تدريجيا : نحتفظ بجافاسكربت خاصتنا، ونعلّم بنانا ودوالّنا، وسيمسك المترجم أخطاء الأنواع قبل الإنتاج. نبدأ خفيفا — واجهات وتواقيع — ونشدد لاحقا. الهدف : تعطّلات أقل عند التشغيل وشيفرة أوضح مع الفريق. »
يُقال في اجتماع الفريق لاعتماد التنميط خطوة خطوة، دون وعد بهجرة كلية فورية.
نموذج للنسخ واللصق — قاعدة tsconfig.json
TS — قاعدة المشروع
{
"compilerOptions": {
"target": "ES2022",
"module": "commonjs",
"outDir": "dist",
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true
},
"include": ["src/**/*"]
}
الأوامر : npx tsc --init (توليد) · npx tsc --noEmit (تحقق) · npx tsc (ترجمة نحو dist)فردي / ميزانية صغيرة
ساليم وحده : يكفي tsconfig أساسي + تعليقات على البنى الحرجة — مع التحقق بـ tsc قبل كل نشر.
شركة صغيرة جدا / فريق مصغر
نمّطوا التواقيع المشتركة (الواجهة، والنماذج) أولا : فهناك تولد أخطاء التكامل.
شركة صغيرة ومتوسطة في الجزائر
يضبط ساليم المرور إلى TypeScript مع الفريق في الجزائر : أولا الملفات الجديدة بـ .ts، وهجرة الباقي مع سير العمل.
فريق يبدأ
ثنائي : أحدهما يكتب JS، والآخر يضيف الواجهات ؛ ومراجعة متقاطعة للأنواع قبل كل دمج.
✓ ممارسات جيدة
- تعلموا TS تدريجيا (تنميط أساسي، ثم واجهات وأصناف معمَّمة).
- أعيدوا استعمال JavaScript خاصتكم (TS = JS + الأنواع).
- اعتمدوا TypeScript في المشاريع الجادة (المتانة، والأدوات، والفريق).
✗ أخطاء شائعة
- تعلم TS دون قاعدة JavaScript متينة (لا يُنمَّط جيدا إلا ما يُفهَم).
- فرض TypeScript على سكربت صغير جدا للرمي (مبالغ فيه).
- تجاهل الاستدلال والإفراط في التعليم لما يخمّنه TS أصلا.
النقاط الأساسية
- TypeScript = مجموعة عليا من JavaScript تضيف التنميط (typing) الساكن (كل JS صالح هو TS صالح) ؛ وتُترجَم إلى JS عادي.
- التنميط الساكن (TS) : أنواع تُتحقق قبل التنفيذ ← يمسك فئة أخطاء مبكرا (مقابل JS الديناميكي، وأخطاء عند التشغيل).
- الفوائد : كشف الأخطاء عند الترجمة، وإكمال تلقائي وأدوات متفوقة، وتوثيق ضمني، ومتانة وقابلية صيانة.
- شبه معيار في Node الاحترافي ؛ ممتاز مع الأدوات الحديثة (Prisma، Zod المنمطة). يُتعلَّم تدريجيا ؛ وإتقان JS يُعاد استعماله.
تحدي 48 ساعة — طبّق غدا
خذوا دالة واحدة من واجهتكم واكتبوا واجهتها + توقيعها المنمط : هل يكتشف المترجم تناقضا فاته ساليم ؟
- أستطيع شرح TS = JS + الأنواع في جملة واحدة.
- دالتي منمطة (واجهة + توقيع) ومتحقَّق منها.
- أعرف متى يكفي JS الخالص ومتى يفرض TS نفسه.
أسئلة شائعة
هل يستحق TypeScript الجهد الإضافي مقارنة بـ JavaScript ؟
في معظم المشاريع الجادة، نعم — والاعتماد الواسع في الصناعة يؤكد ذلك. الكلفة : تعلم نظام الأنواع، وخطوة الترجمة، وبعض الإسهاب (يخففه الاستدلال). الفوائد : أخطاء ممسوكة عند الترجمة (أنواع غير متوافقة، وخصائص غير موجودة، وأخطاء كتابة — التي في JS لا تظهر إلا عند التشغيل، بل في الإنتاج)، وأدوات متفوقة (إكمال تلقائي، وتنقل، وإعادة هيكلة آمنة — مكسب يومي)، ومتانة وثقة، وقابلية صيانة مع الفريق، ومنظومة ممتازة (Prisma، Zod). ولسكربت صغير للرمي، يكفي JavaScript الخالص ؛ ولتطبيق جاد، يستحق TypeScript الجهد إلى حد كبير.
هل يجب تعلم JavaScript بإتقان قبل TypeScript، أم الاثنان معا ؟
يلزم قاعدة جيدة من JavaScript قبل الاستفادة من TypeScript، لأن TS = JS + الأنواع : لا يُنمَّط جيدا إلا ما يُفهَم. تعلموا الأساسيات (async/await، والوحدات، والكائنات) بـ JavaScript الخالص، وابنوا أشياء بـ JS، ثم أدخلوا TypeScript عندما يصير JS مريحا — فيصير تعلم TS سهل الهضم (نظام الأنواع، لا اللغة كلها). لا حاجة لأن تكونوا خبراء مطلقين قبل TS، لكن لا تخلطوا التعلُّمين معا من البداية.
ماذا يقدم TypeScript مقارنة بـ JavaScript ؟