TypeScript، ابرمجموعه ای از جاوا اسکریپت، به دلیل توانایی آن در ارائه تایپ ایستا، افزایش استحکام کد و قابلیت نگهداری، استقبال گسترده ای در بین توسعه دهندگان پیدا کرده است.

یکی از آپشن های کلیدی TypeScript، رابط‌ها است که نقشی محوری در تعریف شکل اشیا، امکان تحلیل نوع و تسهیل سازمان‌دهی بهتر کد را ایفا می‌کنند. در این مقاله، ما عمیقاً به رابط های TypeScript می پردازیم، نحو و موارد استفاده آنها را تحلیل می کنیم.

می توانید تمام کد منبع را از اینجا دریافت کنید.

رابط های TypeScript چیست؟

در هسته خود، یک رابط در TypeScript یک قرارداد نحوی است که ساختار مورد انتظار یک شی را تعریف می کند. روشی برای توصیف شکل اشیا، از جمله ویژگی ها و روش های آنها، بدون اجرای هیچ گونه عملکردی ارائه می دهد. اینترفیس ها صرفاً بر روی ساختار و جنبه های تحلیل نوع تمرکز دارند و امکان درک بهتر کد و اعتبار سنجی را در طول توسعه فراهم می کنند.

نحو رابط های TypeScript

نحو یک رابط TypeScript ساده است:

 interface InterfaceName { property1: type; property2: type; // Additional properties and methods can be defined here }

در اینجا یک تفکیک از عناصر نحو است:

interface : کلمه کلیدی که برای تعریف رابط استفاده می شود.

InterfaceName : نام رابط زیر قراردادهای نامگذاری TypeScript.

property1 , property2 : ویژگی های رابط.

type : حاشیه نویسی نوع TypeScript که نوع هر ویژگی را مشخص می کند.

موارد استفاده رابط TypeScript

چگونه ساختارهای شی را تعریف کنیم

یک کاربرد اساسی از رابط های TypeScript در تعریف ساختارهای شی دیده می شود. سناریویی را تصور کنید که در آن وظیفه دارید اشکال مختلف را در یک پروژه مدیریت کنید. در اینجا، می توانید از یک رابط برای نمایش یک شکل هندسی عمومی استفاده کنید:

 interface Shape { name: string; color: string; area(): number; } console.log("Use Case 1: Defining Object Structures"); console.log("-----------------------------------------"); // Define a function to calculate the area of a shape function calculateArea(shape: Shape): void { console.log(`Calculating area of ${shape.name}...`); console.log(`Area: ${shape.area()}`); } // Define a circle object const circle: Shape = { name: "Circle", color: "Red", area() { return Math.PI * 2 * 2; }, }; // Calculate and log the area of the circle calculateArea(circle);

خروجی:

 Use Case 1: Defining Object Structures ----------------------------------------- Calculating area of Circle... Area: 12.566370614359172

در این مورد، رابطی به نام Shape برای نمایش ساختار اشکال هندسی تعریف می کنیم. رابط Shape شامل name و color خواص، هر دو از نوع string ، و متد area() که یک number برمی گرداند. سپس یک شی دایره را تعریف می کنیم که به رابط Shape می چسبد، ویژگی های آن را مشخص کرده و متد area() را برای محاسبه مساحت آن پیاده سازی می کنیم.

نحوه تایپ کردن پارامترهای تابع

یکی دیگر از نقش های محوری اینترفیس ها در تحلیل نوع پارامترهای تابع در طول زمان کامپایل است. تابعی را در نظر بگیرید که وظیفه محاسبه محیط یک شکل را دارد:

 function calculatePerimeter(shape: Shape): number { // Implementation } console.log("\nUse Case 2: Type-Checking Function Parameters"); console.log("----------------------------------------------"); // Attempt to call the function with a shape object console.log("Calculating perimeter of a shape..."); console.log(`Perimeter: ${calculatePerimeter(circle)}`); // Compiler error: Argument of type 'Shape' is not assignable to parameter of type 'Shape'.

خروجی:

 Use Case 2: Type-Checking Function Parameters ---------------------------------------------- Calculating perimeter of a shape...

 Error: Argument of type 'Shape' is not assignable to parameter of type 'Shape'.

در اینجا، نشان می‌دهیم که چگونه واسط‌ها امکان تحلیل نوع پارامترهای تابع را فراهم می‌کنند. ما یک تابع calculatePerimeter() داریم که یک شی از نوع Shape را به عنوان پارامتر می گیرد. هنگامی که ما سعی می کنیم این تابع را با یک شی circle فراخوانی کنیم، TypeScript یک خطای کامپایلر ایجاد می کند زیرا شی circle دقیقاً با رابط Shape مورد انتظار مطابقت ندارد و ایمنی نوع را در طول توسعه تضمین می کند.

نحوه اجرای قراردادهای کلاسی

رابط‌ها همچنین به عنوان ابزاری مؤثر برای اجرای قراردادها بر روی کلاس‌ها عمل می‌کنند و اطمینان می‌دهند که آنها به ویژگی‌ها و روش‌های خاص پایبند هستند. بیایید این را با ایجاد یک کلاس Circle که رابط Shape را پیاده سازی می کند، مثال بزنیم:

 class Circle implements Shape { constructor(public name: string, public color: string, public radius: number) {} area(): number { return Math.PI * this.radius * this.radius; } } console.log("\nUse Case 3: Implementing Class Contracts"); console.log("------------------------------------------"); // Create an instance of the Circle class const myCircle = new Circle("My Circle", "Blue", 3); // Log the area of the circle console.log(`Area of ${myCircle.name}: ${myCircle.area()}`);

خروجی:

 Use Case 3: Implementing Class Contracts ------------------------------------------ Area of My Circle: 28.274333882308138

در اینجا، نشان می‌دهیم که چگونه واسط‌ها امکان تحلیل نوع پارامترهای تابع را فراهم می‌کنند. ما یک تابع calculatePerimeter() داریم که یک شی از نوع Shape را به عنوان پارامتر می گیرد. هنگامی که ما سعی می کنیم این تابع را با یک شی circle فراخوانی کنیم، TypeScript یک خطای کامپایلر ایجاد می کند زیرا شی circle دقیقاً با رابط Shape مورد انتظار مطابقت ندارد و ایمنی نوع را در طول توسعه تضمین می کند.

نحوه گسترش رابط ها

رابط‌ها می‌توانند رابط‌های دیگر را گسترش دهند و ترکیب و استفاده مجدد از تعاریف رابط را امکان‌پذیر کنند. بیایید رابط Shape را گسترش دهیم تا ویژگی های اضافی برای اشکال سه بعدی را در بر گیرد:

 interface ThreeDShape extends Shape { volume(): number; } console.log("\nUse Case 4: Extending Interfaces"); console.log("----------------------------------"); // Define a function to calculate the volume of a 3D shape function calculateVolume(shape: ThreeDShape): void { console.log(`Calculating volume of ${shape.name}...`); console.log(`Volume: ${shape.volume()}`); } // Define a class for a 3D shape class Sphere implements ThreeDShape { constructor(public name: string, public color: string, public radius: number) {} area(): number { return 4 * Math.PI * this.radius ** 2; } volume(): number { return (4 / 3) * Math.PI * this.radius ** 3; } } // Create an instance of the Sphere class const mySphere = new Sphere("My Sphere", "Green", 4); // Calculate and log the volume of the sphere calculateVolume(mySphere);

خروجی:

 Use Case 4: Extending Interfaces ---------------------------------- Calculating volume of My Sphere... Volume: 268.082573106329

در اینجا، نشان می‌دهیم که چگونه اینترفیس‌ها امکان تحلیل نوع پارامترهای تابع را فراهم می‌کنند. ما یک تابع calculatePerimeter() داریم که یک شی از نوع Shape را به عنوان پارامتر می گیرد. هنگامی که ما سعی می کنیم این تابع را با یک شی circle فراخوانی کنیم، TypeScript یک خطای کامپایلر ایجاد می کند زیرا شی circle دقیقاً با رابط Shape مورد انتظار مطابقت ندارد و ایمنی نوع را در طول توسعه تضمین می کند.

نتیجه

در نتیجه، رابط‌های TypeScript به عنوان ابزاری قدرتمند برای تعریف قراردادها در پایگاه کد شما، تضمین ایمنی نوع و تقویت قابلیت نگهداری کد ظاهر می‌شوند. با استفاده از اینترفیس ها، می توانید انتظارات واضحی را برای ساختارهای شی، پارامترهای تابع، قراردادهای کلاس و موارد دیگر ایجاد کنید.

چه در حال کار بر روی یک برنامه کاربردی ساده یا یک پروژه سازمانی گسترده باشید، تسلط بر رابط ها برای ایجاد کد TypeScript تمیز، قابل اعتماد و قابل نگهداری ضروری است.

اگر بازخوردی دارید، در توییتر یا لینکدین به من پیام دهید.

خبرکاو