Anasayfa » 6. TypeScript’de Fonksiyonlar

6. TypeScript’de Fonksiyonlar

by Levent KARAGÖL
10 dakikalık okuma süresi

Bu makalemizde, TypeScript’de fonksiyon tanımları konusunu işlerken, veri dönmeyen, tekil ve birden fazla tipte veri dönen fonksiyonları inceleyecek, fonksiyonlara opsiyonel parametre eklemeyi ve parametreler için varsayılan değerler belirlemeyi görecek, …rest tipinde parametre geçişinin ve sonrasında da asenkron fonksiyonlar ve bunların geri dönüş tiplerinin üzerinden geçeceğiz. Böylece şimdiye kadar gördüğümüz tip tanımlarını görev başında izleme fırsatımız olacak.


Fonksiyon Tanımları

TypeScript’de fonksiyon tanımlarının temel JavaScript fonksiyonlarından farkı, fonksiyona geçilen parametreler ile fonksiyondan dönen değerlerin tiplerinin tanımlı olması şeklinde özetlenebilir. Aşağıdaki örnekte verilen iki sayıyı toplayarak sonucu geri dönen bir fonksiyonun kullanımını görüyoruz.

function myFunction(value1: number, value2: number): number {

    return value1 + value2;
}

// Aşağıda geçerli bir fonksiyon çağrımı görüyoruz
const result1: number = myFunction(1, 2);

// Fonksiyona geçilen parametrelerin tipleri uyumsuz olduğu için derleme sırasında hataya sebep olur
const result2: number = myFunction("a", "b");

// Fonksiyondan dönülen değerin tipi beklenen tipte olmadığı için derleme sırasında hataya sebep olur
const result3: string = myFunction(1, 2);

// Fonksiyona beklenenden az veya fazla sayıda parametre geçmek de derleme sırasında hataya sebep olur
const result4: number = myFunction(1, 2, 3);


Fonksiyon parametrelerinde tip belirlemek için şimdiye kadar gördüğümüz tip tanımlama yöntemini kullanıyoruz. Fonksiyondan geri dönülecek tip ise fonksiyon parametre parantezini takip eden “:” operatörü ve tip tanımı ile sağlanıyor.


Alternatif Tipte Parametre Alan ve Geri Dönen Fonksiyonlar

Şimdiye kadar gördüğümüz diğer tip tanımlarını da burada kullanmamız elbette mümkündür. Örneğin birden fazla tipte parametre alan ve geri dönüş yapan bir fonksiyon yazmak isteseydik, aşağıdaki gibi bir kod yazmamız gerekirdi.

function myFunction(value: number | string): number | string {

    if (typeof value === "number") {

        return value * value;

    } else {

        return "Merhaba " + value;
    }
}


const result1 = myFunction(5); // 25

const result2 = myFunction("Muhittin"); // Merhaba Muhittin

Yukarıdaki fonksiyona sayısal veya metinsel veri geçiyor olmamız hataya sebep olmaz ve buna göre farklı geri dönüş tipleri elde ederiz (Elbette gücün yanında sorumluluk da getirdiğini unutmayalım).


Özel Tanımlanmış Tipte Parametre Alan ve Geri Dönen Fonksiyonlar

Parametreleri tek tek geçmek yerine özel tanımladığımız tiplerde değer alan ve değer dönen fonksiyonlar da yazabiliriz. Aşağıda başarılı ve başarısız birer kullanım örneği bulunmaktadır.

type myInputType = {
    value1: number,
    value2: number
};

type myReturnType = {
    succeed: boolean,
    result: number
};

function myFunction(values: myInputType): myReturnType {

    return {succeed: true, result: values.value1 + values.value2};
}


const result1: myReturnType = myFunction({value1: 1, value2: 2}); // { succeed: true, result: 3 }

const result2: myReturnType = myFunction({value1: "a"}); // Derleme hatası


Değer Dönmeyen (void) Fonksiyonlar

Elbette her fonksiyon geriye değer dönmek zorunda değildir. Geriye değer dönmeyecek fonksiyonlar (bazı yerlerde bunlara metot adı da veriliyor) “void” dönüş tipi ile temsil edilir.

function myFunction(value1: number, value2: number): void {

    console.log(value1 + value2);
}

// Aşağıda geçerli bir fonksiyon çağrımı görüyoruz
myFunction(1, 2);

// Aşağıdaki çağrım, geriye bir değer dönüşü beklediği için derleme sırasında hataya sebep olur
const result: number = myFunction(1, 2);


Geri Dönmeyen (never) Fonksiyonlar

never” dönüş tipi, hiçbir zaman dönüş yapmayacak fonksiyonlar için kullanılır. “never” dönüş tipi ile “void” dönüş tipini birbirine karıştırmamak gerekir. “void” tipinde fonksiyon tamamlanır ve çağrımın yapıldığı yere geri dönüş yapılır ancak dönüş sırasında herhangi bir veri dönüşü olmaz. Ancak program bir sonraki satırdan çalışmaya devam eder. “never” tipinde ise çağrılan fonksiyondan geri dönülmez, dolayısıyla çağrım yapılan yerin altındaki satıra hiçbir zaman geçilmez.

Aslında “void” kullanımı ne kadar yaygınsa, “never” kullanımı bir o kadar enderdir. Bir fonksiyonda “never” geri dönüşü olabilmesi için ya fonksiyonun bir hata fırlatması ya da “while(true)” gibi bir döngü ile sonsuza denk dönmesi gerekir. Aşağıda her iki durum için de birer örnek mevcuttur.

function myFunction1(): never {

    throw new Error("Bu yolun geri dönüşü yok");
}

function myFunction2(): never {

    while (true) {

        console.log(new Date());
    }
}


Her ne kadar yukarıdaki kullanımlar garip gözükse de, 5’den küçük sayıların karesini alan, 5 ve daha büyük sayılar için ise hata fırlatan aşağıdaki gibi bir fonksiyon kullanımında “never” kullanımı daha mantıklı gelmeye başlayacaktır.

function myFunction(value: number): number | never {

    if (value < 5) {

        return value * value;

    } else {

        throw new Error("Sayı 5'den büyük olamaz");
    }
}


Fonksiyonlarda Opsiyonel Parametreler

TypeScript’de Özel Tip Tanımı isimli makalemizin “Opsiyonel Tipler” başlığı altında, kullanımı opsiyonel tip tanımlarını görmüştük. Aynı mantıkla “?” operatörü vasıtasıyla fonksiyonlara geçilen parametrelerin opsiyonel olarak tanımlanmasını ve bu değerler geçilmediği taktirde derleyicinin hata vermemesini sağlayabiliriz. Aşağıda opsiyonel parametre kullanımına ilişkin bir örnek bulunmaktadır.

function myFunction(value1: number, value2: number, value3?: number): number {

    if (value3 !== undefined) {

        return (value1 + value2) * value3;
    }

    return value1 + value2;
}

// value3 parametresinin gönderimi opsiyonel olduğu için her iki fonksiyon çağrımı da geçerlidir
const result1: number = myFunction(1, 2, 3); // 9
const result2: number = myFunction(1, 2); // 3


Burada dikkat edilmesi gereken husus, opsiyonel parametrelerin diğer parametrelerden sonra gelmesi gerekliliğidir. Bir fonksiyon birden fazla opsiyonel parametre alabilir. Ancak opsiyonel bir parametreden sonra zorunlu bir parametre kullanılamaz.


Fonksiyon Parametreleri için Varsayılan Değerler

Opsiyonel parametre kullanımına alternatif olarak, değer geçilmediği taktirde belirtilen varsayılan değeri alacak parametreler de kullanabiliriz. Bir parametre aynı anda hem opsiyonel hem de varsayılan değere sahip olamaz. İki yöntem birbirinin alternatifidir ve bir arada kullanılamazlar. Aşağıda konuya ilişkin bir örnek bulunmaktadır.

function myFunction(value1: number, value2: number, value3: number = 5): number {

    return (value1 + value2) * value3;
}

// value3 parametresinin varsayılan değeri olduğu için her iki fonksiyon çağrımı da geçerlidir
const result1: number = myFunction(1, 2, 3); // 9
const result2: number = myFunction(1, 2); // 15


Opsiyonel parametrelerde bahsedilen zorunluluğun bir benzeri burada da mevcuttur. Varsayılan değere sahip parametreler diğer parametrelerden sonra kullanılmalıdır, aksi taktirde derleyici değeri hangi parametreye geçmek istediğimizi tahmin edemez.


…rest Tipinde Parametre Tanımı

Bazı durumlarda fonksiyonlara geçilecek parametrelerin sayısını bilemeyebiliriz. Bu durumda zorunlu parametreler sonrasında geçilen tüm parametreleri alıp bir dizide tutacak yapıya ihtiyaç duyarız. Böyle zamanlarda ECMAScript 6 ile gelen “” operatörü yardımımıza yetişir. Konuyu bir örnek üzerinde özetleyelim.

function myFunction(value1: number, value2: number, ...value3: number[]): number {

    let total: number = value1 + value2;

    value3.forEach((value: number) => {
        total += value;
    });

    return total;
}

// İlk iki parametreden sonra geçilen tüm parametreler, value3 dizisine atanır
const result1: number = myFunction(1, 2); // 3
const result2: number = myFunction(1, 2, 3); // 6
const result3: number = myFunction(1, 2, 3, 4); // 10



Asenkron Fonksiyonlar

Asenkron fonksiyonlar artık hayatımızın ayrılmaz birer parçası. Kıyamet piramidinin (Pyramid of Doom) yıkımından bu yana çok zaman geçti. Önce “Promise” kavramı hayatımıza girdi. Sonrasında “async/await” yapısını çok sevdik. TypeScript’de asenkron fonksiyonlar yazarken, bu makalede kullanılan her imkanı kullanmaya devam edeceğiz, ancak küçük bir farkla. Fonksiyonun dönüş değerinin generic bir Promise ifadesi olması gerekiyor.

Henüz generic tanımlamaları görmedik ancak şimdilik tek bilmemiz gereken, döneceğimiz tipi “<>” işaretleri arasına yazıp başına da bir “Promise” kelimesi kondurmak. Bu durum cevap dönmeyen void fonksiyonlar için de geçerlidir. Konuyu bir örnek üzerinde inceleyelim.

async function myFunction1(value1: number, value2: number): Promise<number> {

    return value1 + value2;
}

async function myFunction2(value1: number, value2: number): Promise<void> {

    console.log(value1 + value2);
}


const result: number = await myFunction1(1, 2);

await myFunction2(1, 2);


Böylece TypeScript’de fonksiyonlar konusunun da sonuna geldik. Bir sonraki makalemizde TypeScript’de sınıflar konusunu işleyeceğiz.

Herkese iyi çalışmalar…

İLGİNİZİ ÇEKEBİLİR

Bir Yorum Yaz