الوحدات في TypeScript
تشرح هذه المقالة الوحدات في TypeScript۔
YouTube Video
الوحدات في TypeScript
الوحدات في TypeScript هي ميزة مهمة لتعزيز إعادة استخدام الكود وقابليته للصيانة۔ مثل JavaScript، TypeScript يعتمد أيضًا على نظام الوحدات ECMAScript 2015 (ES6)، ولكن إحدى الميزات الرئيسية هي القدرة على الاستفادة من نظام النوع الخاص بـ TypeScript۔
ما هي الوحدات؟
الوحدة هي نظام لجمع الكود المرتبط في وحدة واحدة يمكن استيرادها وإعادة استخدامها في ملفات أخرى۔ في TypeScript، يتم إنشاء نطاق لكل ملف لتغليف الكود، مما يمنعه من التأثير على الملفات الأخرى۔ يساعد هذا في تجنب التعارضات في الكود ويجعل الصيانة أسهل۔
الوحدات الداخلية والخارجية
- الوحدات الداخلية (المساحات الاسمية): طريقة لتعريف الوحدات كانت تستخدم في TypeScript 1.5 والإصدارات الأقدم، لكنها لم تعد موصى بها الآن۔ يتم التعامل معها الآن كـ 'مساحة اسمية'.۔
- الوحدات الخارجية: المعيار الحالي، القائم على نظام الوحدات ES6۔ يشرح هذا القسم بشكل أساسي الوحدات الخارجية۔
كيفية تصدير الوحدات
عند إنشاء الوحدات، يكون التصدير ضروريًا للسماح بالوصول من الخارج۔ في TypeScript، يمكنك تصدير القيم، الوظائف، الفئات، وما إلى ذلك باستخدام الكلمة المفتاحية export۔ هناك نوعان رئيسيان من التصدير۔
التصدير المسمي
يستخدم لتصدير عناصر متعددة، مما يسمح للطرف المستورد بتحديد واستخدام العناصر المطلوبة۔
1// mathUtils.ts
2export const pi: number = 3.14159;
3
4export function add(x: number, y: number): number {
5 return x + y;
6}
7
8export function subtract(x: number, y: number): number {
9 return x - y;
10}التصدير الافتراضي
يستخدم عندما تريد أن تحتوي الوحدة بالكامل على تصدير افتراضي واحد فقط۔ يتم تصدير التصديرات الافتراضية بدون اسم، مما يسمح للطرف المستورد بتلقيها بأي اسم۔
1// calculator.ts
2export default class Calculator {
3 add(x: number, y: number): number {
4 return x + y;
5 }
6
7 subtract(x: number, y: number): number {
8 return x - y;
9 }
10}كيفية استيراد الوحدات
لاستخدام الوحدات، تقوم باستيراد القيم أو الدوال أو الفئات وما إلى ذلك من داخل الوحدة باستخدام الكلمة المفتاحية import۔
الاستيرادات المسماة
عند استيراد عناصر محددة من التصدير المسمى، استخدم الأقواس الملتفة {}۔
1// main.ts
2import { pi, add, subtract } from './mathUtils';
3
4console.log(`Value of pi: ${pi}`);
5console.log(`Addition: ${add(10, 5)}`);
6console.log(`Subtraction: ${subtract(10, 5)}`);الاستيرادات الافتراضية
عند استيراد التصدير الافتراضي، يمكنك استلامه بأي اسم۔
1// main.ts
2import Calculator from './calculator';
3
4const calculator = new Calculator();
5console.log(`Addition: ${calculator.add(10, 5)}`);
6console.log(`Subtraction: ${calculator.subtract(10, 5)}`);الأسماء المستعارة للاستيراد
لتجنب تكرار الأسماء أو لتقصير الأسماء الطويلة، يمكنك الاستيراد باستخدام اسم مستعار۔
1// main.ts
2import { add as addition, subtract as subtraction } from './mathUtils';
3
4console.log(`Addition: ${addition(10, 5)}`);
5console.log(`Subtraction: ${subtraction(10, 5)}`);الفرق بين الوحدات والمساحات
المساحة (namespace) هي بنية داخلية للوحدات تم استخدامها في بداية TypeScript لتجميع التعليمات البرمجية معًا۔ ومع ذلك، يُوصى الآن باستخدام وحدات ES6، وأصبح استخدام المساحات نادرًا ما يكون ضروريًا۔
يمكن تعريف المساحات داخل نفس الملف أو عبر ملفات متعددة، وبما أنها يمكن أن تتوسع عالميًا، فقد يصبح إدارة التبعيات أمرًا صعبًا۔ على النقيض، فإن الوحدات لها نطاقات منفصلة لكل ملف ولها تبعيات واضحة، مما يجعلها طريقة أكثر حداثة وأمانًا۔
1// Example of a namespace
2namespace Geometry {
3 export function calculateArea(radius: number): number {
4 return Math.PI * radius * radius;
5 }
6}
7
8// Can be used directly without importing the module (not recommended)
9const area: number = Geometry.calculateArea(5);
10console.log(`Area: ${area}`);حل الوحدات في TypeScript
في TypeScript، هناك استراتيجيتان لحل الوحدات۔
- حل وحدات Node: طريقة الحل القياسية المستخدمة في بيئات Node.js والتي تقوم بحل الوحدات عن طريق البحث داخل مجلد
node_modules۔ - حل الوحدات الكلاسيكي: طريقة حل خاصة بـ TypeScript توفر بحثًا أكثر مرونة، لكنها ليست شائعة الاستخدام حاليًا۔
عادةً يتم استخدام حل وحدات Node وهو مفعّل افتراضيًا ما لم يتم تحديد خلاف ذلك في ملف الإعداد۔
مثال عملي
أخيرًا، يتم عرض مثال لتطبيق الوظائف الحسابية وإعادة استخدامها باستخدام الوحدات۔
mathUtils.ts
1export const pi: number = 3.14159;
2
3export function multiply(x: number, y: number): number {
4 return x * y;
5}
6
7export function divide(x: number, y: number): number {
8 if (y === 0) {
9 throw new Error("Cannot divide by zero");
10 }
11 return x / y;
12}calculator.ts
1import { multiply, divide } from './mathUtils';
2
3export default class Calculator {
4 multiplyNumbers(x: number, y: number): number {
5 return multiply(x, y);
6 }
7
8 divideNumbers(x: number, y: number): number {
9 return divide(x, y);
10 }
11}main.ts
1import Calculator from './calculator';
2
3const calculator = new Calculator();
4
5const result1: number = calculator.multiplyNumbers(10, 5);
6console.log(`Multiplication: ${result1}`);
7
8const result2: number = calculator.divideNumbers(10, 2);
9console.log(`Division: ${result2}`);الملخص
نظام الوحدات في TypeScript هو أداة قوية لتنظيم الكود، وتعزيز إمكانية إعادة الاستخدام، وزيادة القابلية للصيانة۔ يوصى باستخدام الوحدات الخارجية المستندة إلى وحدات ES6، كما أن استخدام الكلمات المفتاحية export وimport يتيح تصدير واستيراد الوحدات بسهولة۔
يمكنك متابعة المقالة أعلاه باستخدام Visual Studio Code على قناتنا على YouTube.۔ يرجى التحقق من القناة على YouTube أيضًا.۔