مبانی TypeScript؛ متدها

اندازه‌ی قلم متن

تخمین مدت زمان مطالعه‌ی مطلب: هفت دقیقه

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

نحوه‌ی ایجاد توابع

همانند جاوا اسکریپت، در زبان TypeScript نیز می‌توانیم توابع را هم به صورت named function و هم به صورت anonymous function ایجاد کنیم. در کدهای زیر نحوه‌ی تعریف هر دو نوع نشان داده شده است:

// Named function
function add(x, y) {
    return x + y;
}

// Anonymous function
let myAdd = function(x, y) { return x+y; };

در زبان TypeScript نیز می‌توانیم به متغیرهای تعریف شده‌ی در خارج بدنه‌ی تابع، دسترسی داشته باشیم. در این‌حالت خواهیم گفت که متغیرها توسط تابع capture شده‌اند:

let z = 100;

function addToZ(x, y) {
    return x + y + z;
}

تعیین نوع (Type) برای توابع

همانطور که قبلاً عنوان شد، یکی از مزایای زبان TypeScript، امکان معرفی نوع‌ها است. یعنی با کمک تعیین نوع می‌توانیم کدهای نهایی نوشته شده را امن‌تر کنیم و همچنین در زمان استفاده، Intellisense با وجود نوع‌ها، پیشنهادهای بهتر و دقیق‌تری را ارائه می‌دهد. جهت درک بهتر موضوع اجازه دهید برای توابعی که در مثال قبلی مطرح شدند، یکسری نوع را مشخص کنیم:

function add(x: number, y: number): number {
    return x + y;
}

let myAdd = function(x: number, y: number): number { return x+y; };

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

Function Types

در TypeScript علاوه بر امکان تعیین نوع، برای پارامتر و همچنین نوع بازگشتی تابع، می‌توانیم خود تابع را نیز به عنوان یک نوع تعریف کنیم. function types با تعیین نوع برای پارمتر دریافتی و همچنین تعیین نوع بازگشتی تابع تعریف می‌شوند. به عنوان مثال تابع زیر، یک پارامتر از نوع number را دریافت کرده و در نهایت یک رشته را در خروجی بر می‌گرداند:

function PublicationMessage(year: number): string {
    return 'Date published: ' + year;
}

اکنون می‌توانیم یک متغیر ایجاد کنیم که ارجاعی را به تابع فوق داشته باشد:

let publishFunc: (someYear: number) => string;

با استفاده از سینتکس فوق، توانسته‌ایم یک function type را تعریف کنیم. در کد فوق از کلمه‌ی کلیدی let و همچنین علامت دو نقطه بعد از نام متغیر استفاده کرده‌ایم. سپس پارامترها و همچنین انواع آنها را درون پرانتز تعیین کرده‌ایم و در نهایت بعد از علامت <=، نوع بازگشتی تابع را تعیین کرده‌ایم. در واقع توسط کد فوق، یک امضاء را برای توابعی که قرار است به این متغیر انتساب داده شوند، تعریف کرده‌ایم. اکنون که متغیر را تعریف کردیم و همچنین یک نوع را برای آن مشخص کردیم، می‌توانیم تابعی را که دارای این امضاء است، به آن انتساب دهیم:

publishFunc = PublicationMessage;

let message: string = publishFunc(2016);

در واقع اکنون به متغیر publishFunc، تنها تابعی را می‌توانیم انتساب دهیم که یک پارامتر از جنس number را از ورودی دریافت کرده و همچنین یک رشته را به عنوان خروجی برگرداند. در نتیجه اگر تابعی غیر از امضاء تعیین شده را به متغیر publishFunc انتساب دهیم، کامپایلر TypeScript به ما هشدار خواهد داد:

همچنین می‌توان function type را به صورت inline نیز تعریف کرد:

let myAdd: (baseValue:number, increment:number) => number =
    function(x, y) { return x + y; };

Optional and Default Parameters

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

function CreateCustomer(name: string, age?: number) {}

همانطور که مشاهده می‌کنید با افزودن علامت سوال بعد از نام پارامتر، توانسته‌ایم آن را به صورت اختیاری تعریف کنیم. نکته‌ایی که در اینجا وجود دارد این است که تمامی پارامترهای optional، حتماً باید بعد از پارامترهای required تعریف شوند.

برای تعیین مقدار پیش‌فرض برای هر پارامتر نیز می‌توانیم به این‌صورت عمل کنیم:

function GetBookByTitle(title: string = 'C# 6.0 in a Nutshell') {}

default parameters در صورتیکه بعد از required parameters آورده شوند، به عنوان optional در نظر گرفته می‌شوند. یعنی در این‌حالت لزومی به گذاشتن علامت سوال، بعد از نام پارامتر نیست. نکته‌ی قابل توجه‌ایی که در استفاده از default parameters وجود دارد این است که علاوه بر رشته‌ها می‌توان عبارات (expressions) را نیز به آنها اختصاص داد:

function GetBookByTitle(title: string = GetMostPopularBooks()) {}

Rest Parameters

rest parameters به شما این امکان را می‌دهند تا به تعداد نامحدودی پارامتر به یک تابع ارسال کنید:

function GetBooksReadForCust(name: string, ...bookIDs: number[]) {}

تابع فوق دو پارامتر را از ورودی دریافت می‌کند. پارامتر دوم این تابع به صورت rest تعریف شده است. یعنی برای پارامتر دوم می‌توانیم هر تعداد پارامتری را به این تابع ارسال کنیم. همچنین برای نوع این پارامتر، یک آرایه از نوع number را تعیین کرده‌ایم. یعنی پارامترهای دریافتی، درون یک آرایه از نوع number ذخیره خواهند شد. در ES 5 برای داشتن این چنین قابلیتی از شیء arguments استفاده می‌کردیم. یعنی تابع فوق را می‌بایستی اینگونه می‌نوشتیم:

function GetBooksReadForCust(name) {
    var bookIDs = [];
    for (var _i = 1; _i < arguments.length; _i++) {
        bookIDs[_i - 1] = arguments[_i];
    }
}

استفاده از this

درک this در جاوا اسکریپت، در ابتدا باعث مقداری سردرگمی می‌شود. یعنی مقدار آن در زمان فراخوانی تابع، ست خواهد شد. یعنی در هر بلاک از کد، وضعیت‌های متفاوتی را ارائه می‌دهد. به عنوان مثال درون callback مربوط به تابع setInterval در تابع زیر می‌خواهیم به مقدار متغیر publishDate دسترسی داشته باشم:

function Book() {
    let self = this;
    self.publishDate = 2016;
    setInterval(function() {
        console.log(self.publishDate);
    }, 1000);
}

همانطور که مشاهده می‌کنید برای دسترسی به این پراپرتی، مقدار this را درون یک متغیر با نام self، در ابتدا تعریف کرده‌ایم. زیرا استفاده‌ی مستقیم از this.publishDate درون callback به چیز دیگری اشاره می‌کند. این روش در ES 5 خیلی رایج است. اما با استفاده از Arrow Functions به راحتی می‌توانیم به this در هر جایی دسترسی داشته باشیم. بنابراین کد فوق را می‌توانیم به این صورت بازنویسی کنیم:

function Book() {
    this.publishDate = 2016;
    setInterval(() => {
        console.log(this.publishDate);
    }, 1000);
}

در واقع Arrow Function در پشت صحنه کار capture کردن this را برایمان انجام خواهد داد.

Function overloads

قابلیت function overloading در بیشتر typed languageها در دسترس می‌باشد. همانطور که می‌دانید این قابلیت جهت تعریف امضاءهای مختلف برای یک تابع استفاده می‌شود. یعنی ایجاد توابعی با یک نام، اما با انواع متفاوت. از آنجائیکه TypeScript به جاوا اسکریپت کامپایل می‌شود، در نتیجه جاوا اسکریپت فاقد نوع (type) است. پس در زمان کامپایل نوع‌ها برداشته خواهند شد. بنابراین داشتن توابعی همنام باعث بروز مشکلاتی خواهد شد. برای داشتن نسخه‌های مختلفی از یک تابع می‌توانیم تعاریف موردنیازمان را ارائه داده، اما تنها یک پیاده‌سازی داشته باشیم. برای مثال می‌خواهیم یک overload دیگر برای تابع زیر داشته باشیم:

function GetTitles(author: string) : string[];

تابع فوق یک رشته را از ورودی دریافت کرده و در نهایت یک آرایه از رشته‌ها را بر می‌گرداند. برای overload دیگر این تابع می‌خواهیم به جای دریافت رشته، یک boolean از ورودی دریافت کنیم:

function GetTitles(available: boolean) : string[];

همانطور که مشاهده می‌کنید، هیچکدام از overloadهای فوق پیاده‌سازی‌ایی ندارند. در واقع تا اینجا به TypeScript گفته‌ایم که نیاز به دو نسخه از تابع GetTitles خواهیم داشت. اکنون می‌توانیم یک پیاده‌سازی کلی برای دو overload فوق داشته باشیم:

function GetTitles(bookProperty: any) : string[] {
    if(typeof bookProperty == 'string') {
        // some code
    } else if (typeof bookProperty == 'boolean') {
        // some code
    }
    
    return result;
}

همانطور که عنوان شد، تنها پیاده‌سازی فوق را برای تمامی overloadها خواهیم داشت. در نتیجه اینبار نوع پارامتر ورودی را any تعریف کرده‌ایم. سپس درون بدنه‌ی تابع، نوع پراپرتی را توسط typeof تشخیص داده‌ایم. بنابراین برای فراخوانی هر یک از overloadها، می‌توانیم کدهای خاصی را اجرا کنیم.

مبانی TypeScript؛ متدها

مطالب مشابه