المُزينات التجريبية في TypeScript: نظرة تحت الغطاء

مدرب بايثون أونلاين للمبتدئين

تعلم Python بسهولة دون إرهاق نظري. حل مهام عملية مع التحقق التلقائي واكتب الكود مباشرة في المتصفح.

ابدأ الدورة

لماذا يصرخ TypeScript الخاص بك بشأن "المُزينات التجريبية"؟

\n\n

هل سبق لك أن قمت بتشغيل ترجمة مشروع TypeScript ورأيت في وحدة التحكم شيئًا مثل:

\n\n
الدعم التجريبي للمُزينات هو ميزة قابلة للتغيير في إصدار مستقبلي. قم بتعيين خيار 'experimentalDecorators' في ملف 'tsconfig.json' الخاص بك أو '--experimentalDecorators' لإزالة هذا التحذير.
\n\n

إذا كان الأمر كذلك - فأنت لست وحدك. هذا السؤال على Stack Overflow جمع آلاف المشاهدات وعشرات الإجابات. لكن معظمها يقترح ببساطة "تشغيل العلامة ونسيان الأمر". ونحن اليوم سنذهب أبعد من ذلك: سنفهم ما هو تحذير experimental decorators في TypeScript، ومن أين يأتي، وكيف يعمل تحت الغطاء، ولماذا يعتبر TypeScript المُزينات "تجريبية" أساسًا.

\n\n

ما هي المُزينات في TypeScript (ولماذا هي تجريبية)؟

\n\n

المُزينات هي أداة قوية للبرمجة الوصفية. فهي تسمح بتعليق وتعديل الفئات والطرق والخصائص والمعاملات أثناء وقت التنفيذ. إذا كنت قد عملت مع Angular أو NestJS أو TypeORM، فمن المحتمل أنك صادفتها:

\n\n
@Component({\n  selector: 'app-root',\n  templateUrl: './app.component.html'\n})\nclass AppComponent {}
\n\n

ولكن المشكلة تكمن في أن معيار JavaScript للمُزينات (اقتراح TC39) لا يزال في المرحلة الثالثة (Stage 3). هذا يعني أن بناء الجملة والدلالات قد تتغير. TypeScript، كونه مجموعة شاملة من JavaScript، لا يمكنه ببساطة "تجميد" التنفيذ - فهو يقدم دعمًا تجريبيًا للمُزينات من خلال العلامة experimentalDecorators.

\n\n

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

\n\n

كيف يعمل تحذير experimental decorators تحت غطاء المترجم؟

\n\n

لفهم التحذير، دعنا نلقي نظرة على المصادر الداخلية لـ TypeScript. في ملف checker.ts (نعم، هذا ملف حقيقي داخل المترجم) توجد دالة checkGrammarForDecorator. عندما يواجه المحلل اللغوي مُزينًا، يتحقق المترجم مما إذا كانت العلامة experimentalDecorators مضبوطة في ملف tsconfig.json.

\n\n

إذا لم تكن العلامة مضبوطة، فإنه يُنشئ رسالة تشخيصية - نفس التحذير. إنه ليس خطأ (سيظل الكود يُترجم)، لكن المترجم يذكرك بإصرار: "مرحبًا، أنت تستخدم ميزة قد تتغير!".

\n\n

إليك كيف يبدو المنطق المبسط:

\n\n
// كود زائف للمنطق الحقيقي لـ TypeScript\nfunction checkDecoratorUsage(decorator: Decorator, options: CompilerOptions) {\n  if (!options.experimentalDecorators) {\n    reportDiagnostic({\n      code: 1219,\n      message: "الدعم التجريبي للمُزينات هو ميزة قابلة للتغيير في إصدار مستقبلي..."\n    });\n  }\n}
\n\n

رمز الخطأ 1219 هو بالضبط التحذير الذي تراه. ورمز 1220 هو تحذير مماثل لـ emitDecoratorMetadata (علامة تجريبية أخرى سنتحدث عنها أدناه).

\n\n

كيفية إيقاف تحذير experimental decorators: 3 طرق

\n\n

أسهل طريقة هي إضافة العلامة إلى ملف tsconfig.json:

\n\n
{\n  "compilerOptions": {\n    "experimentalDecorators": true\n  }\n}
\n\n

إذا كنت تستخدم سطر الأوامر:

\n\n
tsc --experimentalDecorators
\n\n

أو إذا لم يكن لديك ملف tsconfig.json، يمكنك تمرير العلامة مباشرة:

\n\n
npx tsc --experimentalDecorators src/index.ts
\n\n

بعد ذلك سيختفي التحذير. لكن هذا مجرد غيض من فيض. دعنا نفهم ما يحدث حقًا عند تشغيل experimentalDecorators.

\n\n

ماذا يُنشئ المترجم تحت الغطاء؟

\n\n

عند كتابة مُزين للفئة

المدونات

توصيات الكتب