Modern web uygulamalar\u0131n\u0131n karma\u015f\u0131kl\u0131\u011f\u0131 artt\u0131k\u00e7a, kod taban\u0131n\u0131n y\u00f6netilebilir, \u00f6l\u00e7eklenebilir ve hatas\u0131z olmas\u0131 kritik bir \u00f6nem ta\u015f\u0131maktad\u0131r. JavaScript’in dinamik yap\u0131s\u0131 esneklik sunsa da, b\u00fcy\u00fck \u00f6l\u00e7ekli projelerde tip g\u00fcvenli\u011fi eksikli\u011fi beklenmedik hatalara yol a\u00e7abilir. \u0130\u015fte bu noktada TypeScript devreye girer. TypeScript, JavaScript’in bir \u00fcst k\u00fcmesidir ve iste\u011fe ba\u011fl\u0131 statik tipleme ile geli\u015ftiricilere daha g\u00fcvenli ve \u00f6ng\u00f6r\u00fclebilir kod yazma imkan\u0131 sunar. Fonksiyonlar, herhangi bir programlama dilinin temel yap\u0131 ta\u015flar\u0131ndan biridir ve TypeScript’te fonksiyonlar\u0131 do\u011fru ve etkin bir \u015fekilde kullanmak, kod kalitesini \u00f6nemli \u00f6l\u00e7\u00fcde art\u0131r\u0131r.<\/p>\n
TypeScript, fonksiyonlara tip bilgisi ekleyerek geli\u015ftirme s\u00fcrecini d\u00f6n\u00fc\u015ft\u00fcr\u00fcr. Parametrelere ve d\u00f6n\u00fc\u015f de\u011ferlerine tip atayarak, derleme zaman\u0131nda potansiyel hatalar\u0131 yakalamam\u0131z\u0131 sa\u011flar. Bu, \u00e7al\u0131\u015fma zaman\u0131 hatalar\u0131n\u0131 azalt\u0131r, kodun okunabilirli\u011fini art\u0131r\u0131r ve refakt\u00f6ring i\u015flemlerini \u00e7ok daha g\u00fcvenli hale getirir. Fonksiyonlar, belirli bir g\u00f6revi yerine getiren yeniden kullan\u0131labilir kod bloklar\u0131d\u0131r. TypeScript ile bu bloklar\u0131 daha g\u00fc\u00e7l\u00fc, daha anla\u015f\u0131l\u0131r ve daha az hataya a\u00e7\u0131k hale getirebiliriz. Bu makale, TypeScript’te fonksiyonlar\u0131 t\u00fcm y\u00f6nleriyle ele alacak, temel tan\u0131mlamalardan ileri seviye kullan\u0131mlara kadar geni\u015f bir yelpazede bilgi sunacakt\u0131r.<\/p>\n
TypeScript’te fonksiyonlar, JavaScript’teki gibi \u00e7e\u015fitli \u015fekillerde tan\u0131mlanabilir. Ancak TypeScript, bu tan\u0131mlamalara tip g\u00fcvenli\u011fi katman\u0131 ekler. Temel olarak \u00fc\u00e7 ana yolla fonksiyon tan\u0131mlayabiliriz: isimli fonksiyonlar, anonim fonksiyonlar ve ok (arrow) fonksiyonlar.<\/p>\n
\u0130simli fonksiyonlar, en geleneksel tan\u0131mlama y\u00f6ntemidir. Fonksiyonun bir ad\u0131 vard\u0131r ve bu adla \u00e7a\u011fr\u0131l\u0131r. TypeScript’te parametrelere ve d\u00f6n\u00fc\u015f de\u011ferine tip atamas\u0131 yapar\u0131z.<\/p>\n
\nfunction topla(sayi1: number, sayi2: number): number {\n return sayi1 + sayi2;\n}\n\nlet sonuc: number = topla(5, 3); \/\/ sonuc: 8\nconsole.log(sonuc);\n<\/code><\/pre>\nYukar\u0131daki \u00f6rnekte, topla<\/code> fonksiyonu iki adet number<\/code> tipinde parametre al\u0131r ve bir number<\/code> tipi d\u00f6nd\u00fcr\u00fcr. TypeScript, bu tiplere uygun olmayan bir \u00e7a\u011fr\u0131 yap\u0131ld\u0131\u011f\u0131nda derleme zaman\u0131 hatas\u0131 verecektir.<\/p>\nAnonim Fonksiyonlar<\/h3>\n
Anonim fonksiyonlar, bir isme sahip olmayan fonksiyonlard\u0131r ve genellikle bir de\u011fi\u015fkene atan\u0131r veya ba\u015fka bir fonksiyona arg\u00fcman olarak ge\u00e7irilir. TypeScript’te anonim fonksiyonlar da tip g\u00fcvenli\u011fi sa\u011flar.<\/p>\n
\nlet carp: (x: number, y: number) => number = function(x: number, y: number): number {\n return x * y;\n};\n\nlet carpmaSonucu: number = carp(4, 2); \/\/ carpmaSonucu: 8\nconsole.log(carpmaSonucu);\n<\/code><\/pre>\nBurada, carp<\/code> de\u011fi\u015fkenine bir fonksiyon tipi atad\u0131k: (x: number, y: number) => number<\/code>. Bu, de\u011fi\u015fkenin iki number<\/code> parametre alan ve bir number<\/code> d\u00f6nd\u00fcren bir fonksiyon olaca\u011f\u0131n\u0131 belirtir. Fonksiyonun kendisi de bu tiplere uygun olarak tan\u0131mlanm\u0131\u015ft\u0131r.<\/p>\nFonksiyon Parametreleri<\/h3>\n
Fonksiyon parametreleri, TypeScript’in tip g\u00fcvenli\u011fi \u00f6zelliklerinin en belirgin oldu\u011fu alanlardan biridir. Parametreleri zorunlu, opsiyonel, varsay\u0131lan de\u011ferli veya rest parametreleri olarak tan\u0131mlayabiliriz.<\/p>\n
Zorunlu Parametreler<\/h3>\n
Varsay\u0131lan olarak, TypeScript’teki t\u00fcm fonksiyon parametreleri zorunludur. Yani, fonksiyon \u00e7a\u011fr\u0131l\u0131rken t\u00fcm tan\u0131ml\u0131 parametreler i\u00e7in bir de\u011fer sa\u011flanmal\u0131d\u0131r.<\/p>\n
\nfunction selamla(isim: string, soyisim: string): string {\n return Merhaba, ${isim} ${soyisim}!<\/code>;\n}\n\nconsole.log(selamla(\"Ay\u015fe\", \"Y\u0131lmaz\")); \/\/ Merhaba, Ay\u015fe Y\u0131lmaz!\n\/\/ console.log(selamla(\"Ahmet\")); \/\/ Hata: 'soyisim' arg\u00fcman\u0131 eksik\n<\/code><\/pre>\nE\u011fer soyisim<\/code> parametresi olmadan selamla<\/code> fonksiyonunu \u00e7a\u011f\u0131rmaya \u00e7al\u0131\u015f\u0131rsak, TypeScript derleme zaman\u0131 hatas\u0131 verir.<\/p>\nOpsiyonel Parametreler<\/h3>\n
Bazen bir parametrenin sa\u011flanmas\u0131 iste\u011fe ba\u011fl\u0131 olabilir. Bu durumda, parametre ad\u0131n\u0131n sonuna ?<\/code> i\u015fareti ekleyerek opsiyonel oldu\u011funu belirtiriz.<\/p>\n\nfunction tamAd(ilkIsim: string, ortaIsim?: string, soyIsim: string): string {\n if (ortaIsim) {\n return ${ilkIsim} ${ortaIsim} ${soyIsim}<\/code>;\n } else {\n return ${ilkIsim} ${soyIsim}<\/code>;\n }\n}\n\nconsole.log(tamAd(\"Can\", \"Demir\")); \/\/ Hata: 'soyIsim' arg\u00fcman\u0131 eksik. Opsiyonel parametreler zorunlu parametrelerden sonra gelmelidir.\n\/\/ Do\u011fru kullan\u0131m:\nfunction tamAdDuzeltilmis(ilkIsim: string, soyIsim: string, ortaIsim?: string): string {\n if (ortaIsim) {\n return ${ilkIsim} ${ortaIsim} ${soyIsim}<\/code>;\n } else {\n return ${ilkIsim} ${soyIsim}<\/code>;\n }\n}\nconsole.log(tamAdDuzeltilmis(\"Ay\u015fe\", \"Y\u0131lmaz\")); \/\/ Ay\u015fe Y\u0131lmaz\nconsole.log(tamAdDuzeltilmis(\"Can\", \"Kara\", \"Ali\")); \/\/ Can Ali Kara\n<\/code><\/pre>\n\u00d6nemli Not:<\/strong> Opsiyonel parametreler, zorunlu parametrelerden sonra gelmelidir. Aksi takdirde, TypeScript bir hata verir.<\/p>\nVarsay\u0131lan De\u011ferli Parametreler<\/h3>\n
Bir parametreye varsay\u0131lan bir de\u011fer atayarak, bu parametrenin opsiyonel olmas\u0131n\u0131 sa\u011flayabiliriz. E\u011fer fonksiyon \u00e7a\u011fr\u0131l\u0131rken bu parametre i\u00e7in bir de\u011fer sa\u011flanmazsa, varsay\u0131lan de\u011feri kullan\u0131l\u0131r.<\/p>\n
\nfunction indirimUygula(fiyat: number, indirimOrani: number = 0.10): number {\n return fiyat * (1 - indirimOrani);\n}\n\nconsole.log(indirimUygula(100)); \/\/ 90 (indirimOrani varsay\u0131lan olarak 0.10)\nconsole.log(indirimUygula(200, 0.25)); \/\/ 150 (indirimOrani 0.25 olarak verildi)\n<\/code><\/pre>\nVarsay\u0131lan de\u011ferli parametreler de opsiyonel parametreler gibi davran\u0131r ve genellikle zorunlu parametrelerden sonra tan\u0131mlanmal\u0131d\u0131r.<\/p>\n
Rest Parametreler<\/h3>\n
Bazen bir fonksiyona ka\u00e7 tane arg\u00fcman ge\u00e7irilece\u011fini \u00f6nceden bilemeyiz. Bu durumlarda, “rest parametreler” (...<\/code>) kullanarak kalan t\u00fcm arg\u00fcmanlar\u0131 bir dizi olarak yakalayabiliriz.<\/p>\n\nfunction toplamHesapla(...sayilar: number[]): number {\n let toplam = 0;\n for (let i = 0; i < sayilar.length; i++) {\n toplam += sayilar[i];\n }\n return toplam;\n}\n\nconsole.log(toplamHesapla(1, 2, 3)); \/\/ 6\nconsole.log(toplamHesapla(10, 20, 30, 40)); \/\/ 100\n<\/code><\/pre>\nRest parametreler her zaman son parametre olmal\u0131d\u0131r ve bir dizi tipiyle tan\u0131mlan\u0131r.<\/p>\n
Fonksiyon D\u00f6n\u00fc\u015f Tipleri<\/h3>\n
TypeScript, fonksiyonlar\u0131n ne t\u00fcr bir de\u011fer d\u00f6nd\u00fcrece\u011fini de belirtmemize olanak tan\u0131r. Bu, kodun \u00f6ng\u00f6r\u00fclebilirli\u011fini art\u0131r\u0131r ve d\u00f6n\u00fc\u015f de\u011ferinin yanl\u0131\u015f kullan\u0131lmas\u0131n\u0131 engeller.<\/p>\n
Belirli D\u00f6n\u00fc\u015f Tipleri<\/h3>\n
En yayg\u0131n kullan\u0131m, fonksiyonun belirli bir tipte de\u011fer d\u00f6nd\u00fcrmesini beklemektir.<\/p>\n
\nfunction buyukHarfYap(metin: string): string {\n return metin.toUpperCase();\n}\n\nfunction kareAl(sayi: number): number {\n return sayi * sayi;\n}\n\nconsole.log(buyukHarfYap(\"typescript\")); \/\/ TYPESCRIPT\nconsole.log(kareAl(7)); \/\/ 49\n<\/code><\/pre>\nvoid<\/code> D\u00f6n\u00fc\u015f Tipi<\/h3>\nBir fonksiyon hi\u00e7bir de\u011fer d\u00f6nd\u00fcrm\u00fcyorsa, d\u00f6n\u00fc\u015f tipi olarak void<\/code> kullan\u0131r\u0131z. Bu, fonksiyonun yan etkileri oldu\u011funu ancak bir sonu\u00e7 \u00fcretmedi\u011fini belirtir.<\/p>\n\nfunction logMesaji(mesaj: string): void {\n console.log(mesaj);\n}\n\nlogMesaji(\"Merhaba TypeScript!\"); \/\/ Konsola \"Merhaba TypeScript!\" yazar, fonksiyon bir de\u011fer d\u00f6nd\u00fcrmez.\n<\/code><\/pre>\nnever<\/code> D\u00f6n\u00fc\u015f Tipi<\/h3>\nnever<\/code> tipi, fonksiyonun asla bir de\u011fer d\u00f6nd\u00fcrmeyece\u011fini veya hi\u00e7bir zaman normal bir \u015fekilde tamamlanmayaca\u011f\u0131n\u0131 belirtir. Bu genellikle bir hata f\u0131rlatan veya sonsuz d\u00f6ng\u00fcye giren fonksiyonlar i\u00e7in kullan\u0131l\u0131r.<\/p>\n\nfunction hataFirlat(mesaj: string): never {\n throw new Error(mesaj);\n}\n\nfunction sonsuzDongu(): never {\n while (true) {\n \/\/ ...\n }\n}\n\n\/\/ hataFirlat(\"Kritik bir hata olu\u015ftu!\"); \/\/ Bu sat\u0131r program\u0131 durdurur.\n<\/code><\/pre>\nnever<\/code>, void<\/code>'den farkl\u0131d\u0131r \u00e7\u00fcnk\u00fc void<\/code> bir fonksiyonun undefined<\/code> d\u00f6nd\u00fcrebilece\u011fi anlam\u0131na gelirken, never<\/code> fonksiyonun asla bir noktaya ula\u015famayaca\u011f\u0131n\u0131 (yani, kontrol ak\u0131\u015f\u0131n\u0131n asla geri d\u00f6nmeyece\u011fini) ifade eder.<\/p>\nunknown<\/code> ve any<\/code> D\u00f6n\u00fc\u015f Tipleri<\/h3>\nunknown<\/code> ve any<\/code> tipleri, fonksiyonlar\u0131n d\u00f6n\u00fc\u015f de\u011feri hakk\u0131nda \u00e7ok az veya hi\u00e7 bilgiye sahip olmad\u0131\u011f\u0131m\u0131z durumlarda kullan\u0131labilir, ancak any<\/code> kullanmaktan ka\u00e7\u0131nmak genellikle en iyi uygulamad\u0131r. unknown<\/code>, any<\/code>'den daha g\u00fcvenli bir alternatiftir \u00e7\u00fcnk\u00fc unknown<\/code> tipindeki bir de\u011feri kullanmadan \u00f6nce tip kontrol\u00fc yapman\u0131z\u0131 zorunlu k\u0131lar.<\/p>\n\nfunction bilinmeyenVeriGetir(): unknown {\n \/\/ API'den gelen veya dinamik bir veri\n return { id: 1, name: \"\u00dcr\u00fcn A\" };\n}\n\nlet veri: unknown = bilinmeyenVeriGetir();\n\n\/\/ console.log(veri.name); \/\/ Hata: 'veri' tipi 'unknown'.\n\/\/ Kullanmadan \u00f6nce tip kontrol\u00fc yap\u0131lmal\u0131:\nif (typeof veri === 'object' && veri !== null && 'name' in veri) {\n console.log((veri as { name: string }).name); \/\/ \u00dcr\u00fcn A\n}\n<\/code><\/pre>\nany<\/code> ise tip kontrol\u00fcn\u00fc tamamen devre d\u0131\u015f\u0131 b\u0131rak\u0131r ve bu nedenle dikkatli kullan\u0131lmal\u0131d\u0131r.<\/p>\nArrow Fonksiyonlar (Ok Fonksiyonlar)<\/h3>\n
ES6 ile birlikte tan\u0131t\u0131lan arrow fonksiyonlar, TypeScript'te de yayg\u0131n olarak kullan\u0131l\u0131r. Daha k\u0131sa s\u00f6zdizimine sahiptirler ve \u00f6zellikle this<\/code> ba\u011flam\u0131n\u0131 ele al\u0131\u015f bi\u00e7imleri nedeniyle avantajl\u0131d\u0131rlar.<\/p>\nS\u00f6zdizimi ve Avantajlar\u0131<\/h3>\n
Arrow fonksiyonlar\u0131n s\u00f6zdizimi daha kompaktt\u0131r:<\/p>\n
\n\/\/ Geleneksel fonksiyon\nconst toplaGeleneksel = function(a: number, b: number): number {\n return a + b;\n};\n\n\/\/ Arrow fonksiyon\nconst toplaArrow = (a: number, b: number): number => a + b;\n\nconsole.log(toplaArrow(10, 20)); \/\/ 30\n\n\/\/ Tek parametre i\u00e7in parantez iste\u011fe ba\u011fl\u0131d\u0131r:\nconst karesi = (x: number): number => x * x;\nconsole.log(karesi(5)); \/\/ 25\n\n\/\/ Parametresiz fonksiyon:\nconst merhaba = (): string => \"Merhaba D\u00fcnya!\";\nconsole.log(merhaba()); \/\/ Merhaba D\u00fcnya!\n<\/code><\/pre>\nTek sat\u0131rl\u0131k fonksiyon g\u00f6vdelerinde return<\/code> anahtar kelimesi ve s\u00fcsl\u00fc parantezler iste\u011fe ba\u011fl\u0131d\u0131r. Bu, daha temiz ve okunabilir kod sa\u011flar.<\/p>\nthis<\/code> Ba\u011flam\u0131<\/h3>\nArrow fonksiyonlar\u0131n en \u00f6nemli \u00f6zelliklerinden biri, this<\/code> ba\u011flam\u0131n\u0131 tan\u0131mland\u0131klar\u0131 yerden (lexical this<\/code>) almalar\u0131d\u0131r. Geleneksel fonksiyonlarda this<\/code>'in de\u011feri, fonksiyonun nas\u0131l \u00e7a\u011fr\u0131ld\u0131\u011f\u0131na ba\u011fl\u0131 olarak de\u011fi\u015firken, arrow fonksiyonlarda bu durum sabittir ve \u00e7evreleyen kapsamdaki this<\/code> de\u011ferini korur.<\/p>\n\nclass Kullanici {\n isim: string;\n\n constructor(isim: string) {\n this.isim = isim;\n }\n\n \/\/ Geleneksel fonksiyon ile 'this' problemi\n selamVerGecikmeliGeleneksel() {\n setTimeout(function() {\n \/\/ console.log(Merhaba, ${this.isim}<\/code>); \/\/ Hata: 'this' burada 'Kullanici' de\u011fil, global veya undefined\n }, 1000);\n }\n\n \/\/ Arrow fonksiyon ile 'this' ba\u011flam\u0131n\u0131n korunmas\u0131\n selamVerGecikmeliArrow() {\n setTimeout(() => {\n console.log(Merhaba, ${this.isim}<\/code>); \/\/ 'this', Kullanici \u00f6rne\u011fine ba\u011fl\u0131 kal\u0131r\n }, 1000);\n }\n}\n\nconst user = new Kullanici(\"Ali\");\n\/\/ user.selamVerGecikmeliGeleneksel(); \/\/ Hata verir veya undefined basar\nuser.selamVerGecikmeliArrow(); \/\/ 1 saniye sonra \"Merhaba, Ali\" yazar\n<\/code><\/pre>\nBu \u00f6zellik, \u00f6zellikle olay dinleyicileri (event listeners) ve asenkron i\u015flemlerle \u00e7al\u0131\u015f\u0131rken kodun \u00e7ok daha basit ve anla\u015f\u0131l\u0131r olmas\u0131n\u0131 sa\u011flar.<\/p>\n
Fonksiyon A\u015f\u0131r\u0131 Y\u00fcklemesi (Function Overloading)<\/h3>\n
TypeScript, ayn\u0131 isimde ancak farkl\u0131 parametre tiplerine veya say\u0131lar\u0131na sahip fonksiyonlar tan\u0131mlamam\u0131za olanak tan\u0131r. Bu \u00f6zelli\u011fe fonksiyon a\u015f\u0131r\u0131 y\u00fcklemesi denir. JavaScript'te do\u011frudan a\u015f\u0131r\u0131 y\u00fckleme deste\u011fi bulunmazken, TypeScript derleme zaman\u0131nda bu esnekli\u011fi sa\u011flar.<\/p>\n
Neden Gerekli?<\/h3>\n
Bir fonksiyonun farkl\u0131 giri\u015f tiplerine g\u00f6re farkl\u0131 davran\u0131\u015flar sergilemesi gerekti\u011finde a\u015f\u0131r\u0131 y\u00fckleme kullan\u0131\u015fl\u0131d\u0131r. \u00d6rne\u011fin, bir olustur<\/code> fonksiyonu hem bir say\u0131 al\u0131p bir dizi d\u00f6nd\u00fcrebilir hem de bir dize al\u0131p bir nesne d\u00f6nd\u00fcrebilir.<\/p>\nUygulama Y\u00f6ntemi<\/h3>\n
TypeScript'te fonksiyon a\u015f\u0131r\u0131 y\u00fcklemesi, birden fazla \"imza\" (signature) tan\u0131mlayarak ve ard\u0131ndan bu imzalar\u0131 kar\u015f\u0131layan tek bir \"implementasyon\" (implementation) fonksiyonu yazarak yap\u0131l\u0131r. \u0130mza fonksiyonlar\u0131 sadece tip tan\u0131mlamalar\u0131n\u0131 i\u00e7erir, implementasyon fonksiyonu ise t\u00fcm olas\u0131 \u00e7a\u011fr\u0131lar\u0131 kapsayacak \u015fekilde yaz\u0131l\u0131r ve genellikle any<\/code> veya unknown<\/code> gibi daha geni\u015f tipler kullan\u0131r.<\/p>\n\n\/\/ A\u015f\u0131r\u0131 y\u00fckleme imzalar\u0131\nfunction islemYap(x: number): number[];\nfunction islemYap(x: string): object;\nfunction islemYap(x: boolean): boolean;\n\n\/\/ Implementasyon fonksiyonu\nfunction islemYap(x: number | string | boolean): number[] | object | boolean {\n if (typeof x === \"number\") {\n return Array(x).fill(0); \/\/ Say\u0131 ise, o kadar elemanl\u0131 bir dizi d\u00f6nd\u00fcr\n } else if (typeof x === \"string\") {\n return { mesaj: x.toUpperCase() }; \/\/ String ise, b\u00fcy\u00fck harfli mesaj i\u00e7eren bir nesne d\u00f6nd\u00fcr\n } else if (typeof x === \"boolean\") {\n return !x; \/\/ Boolean ise, tersini d\u00f6nd\u00fcr\n }\n throw new Error(\"Ge\u00e7ersiz arg\u00fcman tipi\");\n}\n\nconsole.log(islemYap(3)); \/\/ [0, 0, 0]\nconsole.log(islemYap(\"hello\")); \/\/ { mesaj: \"HELLO\" }\nconsole.log(islemYap(true)); \/\/ false\n\n\/\/ console.log(islemYap({})); \/\/ Hata: 'islemYap' a\u015f\u0131r\u0131 y\u00fcklemesinin hi\u00e7bir imzas\u0131 bu \u00e7a\u011fr\u0131ya uygun de\u011fil.\n<\/code><\/pre>\nImplementasyon fonksiyonunun imzas\u0131, t\u00fcm a\u015f\u0131r\u0131 y\u00fckleme imzalar\u0131n\u0131 kapsayacak \u015fekilde daha geni\u015f tiplere sahip olmal\u0131d\u0131r. Kullan\u0131c\u0131lar ise sadece a\u015f\u0131r\u0131 y\u00fckleme imzalar\u0131n\u0131 g\u00f6r\u00fcr ve bu sayede tip g\u00fcvenli\u011fi sa\u011flan\u0131r.<\/p>\n
Jenerik Fonksiyonlar (Generic Functions)<\/h3>\n
Jenerikler, bir fonksiyonun veya s\u0131n\u0131f\u0131n birden fazla tipte veriyle \u00e7al\u0131\u015fabilmesini sa\u011flayan g\u00fc\u00e7l\u00fc bir TypeScript \u00f6zelli\u011fidir. Bu, kodun yeniden kullan\u0131labilirli\u011fini art\u0131r\u0131r ve tip g\u00fcvenli\u011fini korurken esneklik sa\u011flar.<\/p>\n
Jeneriklere Giri\u015f<\/h3>\n
Bir fonksiyonun farkl\u0131 tiplerle \u00e7al\u0131\u015fmas\u0131 gerekti\u011finde, her tip i\u00e7in ayr\u0131 bir fonksiyon yazmak yerine jenerik bir fonksiyon tan\u0131mlayabiliriz. \u00d6rne\u011fin, bir dizideki ilk eleman\u0131 d\u00f6nd\u00fcren bir fonksiyon d\u00fc\u015f\u00fcnelim. Bu fonksiyon hem say\u0131 dizileriyle hem de dize dizileriyle \u00e7al\u0131\u015fabilmelidir.<\/p>\n
Jenerik Fonksiyonlar\u0131n Tan\u0131mlanmas\u0131<\/h3>\n
Jenerik fonksiyonlar, tip parametreleri (genellikle T<\/code> harfiyle temsil edilir) kullan\u0131larak tan\u0131mlan\u0131r. Tip parametresi, fonksiyonun \u00e7a\u011fr\u0131ld\u0131\u011f\u0131 anda ger\u00e7ek bir tipe d\u00f6n\u00fc\u015f\u00fcr.<\/p>\n\nfunction ilkElemaniAl(dizi: T[]): T {\n return dizi[0];\n}\n\nlet sayiDizisi = [1, 2, 3];\nlet ilkSayi = ilkElemaniAl(sayiDizisi); \/\/ ilkSayi tipi: number\nconsole.log(ilkSayi); \/\/ 1\n\nlet metinDizisi = [\"elma\", \"armut\", \"kiraz\"];\nlet ilkMetin = ilkElemaniAl(metinDizisi); \/\/ ilkMetin tipi: string\nconsole.log(ilkMetin); \/\/ elma\n\n\/\/ TypeScript, tipi otomatik olarak \u00e7\u0131kar\u0131r.\n\/\/ \u0130sterseniz a\u00e7\u0131k\u00e7a da belirtebilirsiniz:\nlet ilkBoolean = ilkElemaniAl([true, false]); \/\/ ilkBoolean tipi: boolean\nconsole.log(ilkBoolean); \/\/ true\n<\/code><\/pre>\nBurada <\/code> ifadesi, T<\/code>'nin bir tip parametresi oldu\u011funu belirtir. dizi: T[]<\/code> parametresi, fonksiyonun T<\/code> tipindeki elemanlardan olu\u015fan bir dizi alaca\u011f\u0131n\u0131, : T<\/code> ise T<\/code> tipinde bir de\u011fer d\u00f6nd\u00fcrece\u011fini ifade eder.<\/p>\nTip K\u0131s\u0131tlamalar\u0131 (Type Constraints)<\/h3>\n
Bazen jenerik bir tip \u00fczerinde belirli i\u015flemler yapmak isteyebiliriz. \u00d6rne\u011fin, bir nesnenin bir \u00f6zelli\u011fine eri\u015fmek gibi. Ancak T<\/code>'nin herhangi bir tip olabilece\u011fi i\u00e7in, bu i\u015flem her zaman g\u00fcvenli olmayabilir. Bu durumda, jenerik tipe k\u0131s\u0131tlamalar (extends<\/code>) ekleyebiliriz.<\/p>\n\ninterface HasLength {\n length: number;\n}\n\nfunction uzunluguYazdir(arg: T): void {\n console.log(Uzunluk: ${arg.length}<\/code>);\n}\n\nuzunluguYazdir(\"Merhaba\"); \/\/ Uzunluk: 7 (string'in length \u00f6zelli\u011fi var)\nuzunluguYazdir([1, 2, 3]); \/\/ Uzunluk: 3 (array'in length \u00f6zelli\u011fi var)\n\/\/ uzunluguYazdir(10); \/\/ Hata: 'number' tipi 'HasLength' aray\u00fcz\u00fcne atanabilir de\u011fil.\n\/\/ uzunluguYazdir({ a: 1 }); \/\/ Hata: '{ a: number }' tipi 'HasLength' aray\u00fcz\u00fcne atanabilir de\u011fil.\nuzunluguYazdir({ length: 5, value: \"test\" }); \/\/ Uzunluk: 5 (nesnenin length \u00f6zelli\u011fi var)\n<\/code><\/pre>\nYukar\u0131daki \u00f6rnekte, uzunluguYazdir<\/code> fonksiyonu sadece length<\/code> \u00f6zelli\u011fine sahip tiplerle \u00e7al\u0131\u015fabilir. Bu, T<\/code> tipinin HasLength<\/code> aray\u00fcz\u00fcn\u00fc geni\u015fletmesi gerekti\u011fini belirtir. Bu sayede, fonksiyon i\u00e7inde arg.length<\/code> \u00f6zelli\u011fine g\u00fcvenli bir \u015fekilde eri\u015febiliriz.<\/p>\nCallback Fonksiyonlar ve Y\u00fcksek Mertebeden Fonksiyonlar<\/h3>\n
Fonksiyonlar, JavaScript ve TypeScript'te birinci s\u0131n\u0131f vatanda\u015flard\u0131r, yani de\u011fi\u015fkenlere atanabilir, arg\u00fcman olarak ge\u00e7irilebilir ve di\u011fer fonksiyonlardan d\u00f6nd\u00fcr\u00fclebilirler. Bu \u00f6zellik, callback fonksiyonlar\u0131 ve y\u00fcksek mertebeden fonksiyonlar kavramlar\u0131n\u0131 ortaya \u00e7\u0131kar\u0131r.<\/p>\n
Callback Fonksiyonlar Nedir?<\/h3>\n
Bir callback fonksiyonu, ba\u015fka bir fonksiyona arg\u00fcman olarak ge\u00e7irilen ve ana fonksiyonun belirli bir i\u015flemi tamamlad\u0131ktan sonra veya belirli bir olay ger\u00e7ekle\u015fti\u011finde \u00e7a\u011fr\u0131lan fonksiyondur. Asenkron programlamada ve olay odakl\u0131 mimarilerde yayg\u0131n olarak kullan\u0131l\u0131rlar.<\/p>\n
\nfunction veriIsle(veri: string, callback: (islenmisVeri: string) => void): void {\n console.log(\"Veri i\u015fleniyor...\");\n \/\/ Sim\u00fcle edilmi\u015f asenkron i\u015flem\n setTimeout(() => {\n const islenmisVeri = veri.toUpperCase();\n callback(islenmisVeri);\n }, 1000);\n}\n\nveriIsle(\"typescript \u00f6\u011freniyorum\", (sonuc) => {\n console.log(\u0130\u015flem tamamland\u0131: ${sonuc}<\/code>);\n});\n\/\/ \u00c7\u0131kt\u0131:\n\/\/ Veri i\u015fleniyor...\n\/\/ (1 saniye sonra)\n\/\/ \u0130\u015flem tamamland\u0131: TYPESCRIPT \u00d6\u011eREN\u0130YORUM\n<\/code><\/pre>\nBurada veriIsle<\/code> fonksiyonu, ikinci parametre olarak bir callback fonksiyonu al\u0131r. Bu callback, bir string<\/code> arg\u00fcman\u0131 alan ve hi\u00e7bir de\u011fer d\u00f6nd\u00fcrmeyen bir fonksiyondur.<\/p>\nY\u00fcksek Mertebeden Fonksiyonlar (Higher-Order Functions)<\/h3>\n
Y\u00fcksek mertebeden fonksiyonlar, bir veya daha fazla fonksiyonu arg\u00fcman olarak alan veya bir fonksiyon d\u00f6nd\u00fcren fonksiyonlard\u0131r. Callback'ler, y\u00fcksek mertebeden fonksiyonlar\u0131n bir alt k\u00fcmesidir.<\/p>\n
\n\/\/ Bir fonksiyonu arg\u00fcman olarak alan y\u00fcksek mertebeden fonksiyon\nfunction islemYapici(islem: (sayi: number) => number): (dizi: number[]) => number[] {\n return (dizi: number[]) => dizi.map(islem);\n}\n\nconst kareAlici = (x: number) => x * x;\nconst ikiyleCarpici = (x: number) => x * 2;\n\nconst kareleriAl = islemYapici(kareAlici);\nconst ikiyleCarp = islemYapici(ikiyleCarpici);\n\nconsole.log(kareleriAl([1, 2, 3])); \/\/ [1, 4, 9]\nconsole.log(ikiyleCarp([1, 2, 3])); \/\/ [2, 4, 6]\n\n\/\/ Bir fonksiyon d\u00f6nd\u00fcren y\u00fcksek mertebeden fonksiyon\nfunction loglayiciOlustur(prefix: string): (mesaj: string) => void {\n return (mesaj: string) => {\n console.log(${prefix}: ${mesaj}<\/code>);\n };\n}\n\nconst hataLoglayici = loglayiciOlustur(\"HATA\");\nconst bilgiLoglayici = loglayiciOlustur(\"B\u0130LG\u0130\");\n\nhataLoglayici(\"Bir sorun olu\u015ftu!\"); \/\/ HATA: Bir sorun olu\u015ftu!\nbilgiLoglayici(\"\u0130\u015flem ba\u015far\u0131yla tamamland\u0131.\"); \/\/ B\u0130LG\u0130: \u0130\u015flem ba\u015far\u0131yla tamamland\u0131.\n<\/code><\/pre>\nY\u00fcksek mertebeden fonksiyonlar, fonksiyonel programlama prensiplerinin temelini olu\u015fturur ve kodun daha mod\u00fcler, yeniden kullan\u0131labilir ve test edilebilir olmas\u0131n\u0131 sa\u011flar.<\/p>\n
Async\/Await Fonksiyonlar<\/h3>\n
Asenkron programlama, modern JavaScript ve TypeScript uygulamalar\u0131n\u0131n ayr\u0131lmaz bir par\u00e7as\u0131d\u0131r. A\u011f istekleri, dosya okuma\/yazma gibi uzun s\u00fcren i\u015flemlerin ana i\u015f par\u00e7ac\u0131\u011f\u0131n\u0131 (main thread) bloke etmeden \u00e7al\u0131\u015fmas\u0131n\u0131 sa\u011flar. async\/await<\/code> s\u00f6zdizimi, Promise tabanl\u0131 asenkron kodu senkron koda benzer \u015fekilde yazmam\u0131z\u0131 kolayla\u015ft\u0131r\u0131r.<\/p>\nAsenkron Programlama ve Promises<\/h3>\n
async<\/code> fonksiyonlar, her zaman bir Promise d\u00f6nd\u00fcr\u00fcr. await<\/code> anahtar kelimesi ise sadece async<\/code> fonksiyonlar i\u00e7inde kullan\u0131labilir ve bir Promise'in \u00e7\u00f6z\u00fclmesini bekler. Bu, asenkron kodun ad\u0131m ad\u0131m, okunabilir bir \u015fekilde yaz\u0131lmas\u0131n\u0131 sa\u011flar.<\/p>\n\nfunction gecikmeliVeriGetir(id: number): Promise {\n return new Promise((resolve) => {\n setTimeout(() => {\n resolve(ID ${id} i\u00e7in veri<\/code>);\n }, 1500);\n });\n}\n\nasync function veriIsleAsync(): Promise {\n try {\n console.log(\"Veri bekleniyor...\");\n const veri1 = await gecikmeliVeriGetir(1);\n console.log(veri1); \/\/ 1.5 saniye sonra: \"ID 1 i\u00e7in veri\"\n\n const veri2 = await gecikmeliVeriGetir(2);\n console.log(veri2); \/\/ 1.5 saniye sonra: \"ID 2 i\u00e7in veri\"\n\n console.log(\"T\u00fcm veriler i\u015flendi.\");\n } catch (error) {\n console.error(\"Bir hata olu\u015ftu:\", error);\n }\n}\n\nveriIsleAsync();\n<\/code><\/pre>\nYukar\u0131daki \u00f6rnekte, veriIsleAsync<\/code> bir async<\/code> fonksiyondur. \u0130\u00e7indeki await<\/code> ifadeleri, gecikmeliVeriGetir<\/code> Promise'lerinin tamamlanmas\u0131n\u0131 bekler. Bu sayede kod, sanki senkron bir \u015fekilde \u00e7al\u0131\u015f\u0131yormu\u015f gibi g\u00f6r\u00fcn\u00fcr, ancak asl\u0131nda arka planda asenkron olarak ilerler. Promise<\/code> d\u00f6n\u00fc\u015f tipi, fonksiyonun bir Promise d\u00f6nd\u00fcrd\u00fc\u011f\u00fcn\u00fc ancak \u00e7\u00f6z\u00fcld\u00fc\u011f\u00fcnde bir de\u011fer ta\u015f\u0131mad\u0131\u011f\u0131n\u0131 g\u00f6sterir.<\/p>\nTip Korumalar\u0131 ve Fonksiyonlar<\/h3>\n
TypeScript'in en g\u00fc\u00e7l\u00fc \u00f6zelliklerinden biri, derleme zaman\u0131nda tip kontrol\u00fc yapmas\u0131d\u0131r. Ancak bazen \u00e7al\u0131\u015fma zaman\u0131nda bir de\u011fi\u015fkenin tipini daraltmam\u0131z gerekebilir. Bu durumlarda \"tip korumalar\u0131\" (type guards) kullan\u0131r\u0131z. Fonksiyonlar, kullan\u0131c\u0131 tan\u0131ml\u0131 tip korumalar\u0131 olu\u015fturmak i\u00e7in m\u00fckemmel bir ara\u00e7t\u0131r.<\/p>\n
Kullan\u0131c\u0131 Tan\u0131ml\u0131 Tip Korumalar\u0131<\/h3>\n
Kullan\u0131c\u0131 tan\u0131ml\u0131 tip korumalar\u0131, bir fonksiyonun belirli bir tip testi yapt\u0131\u011f\u0131n\u0131 ve e\u011fer test ba\u015far\u0131l\u0131 olursa, fonksiyonun arg\u00fcman\u0131n\u0131n belirli bir tipe daralt\u0131ld\u0131\u011f\u0131n\u0131 TypeScript'e bildiren \u00f6zel bir d\u00f6n\u00fc\u015f tipi imzas\u0131na sahiptir: parametreAdi is Tip<\/code>.<\/p>\n\ninterface Kedi {\n miyawla(): void;\n cins: string;\n}\n\ninterface Kopek {\n havla(): void;\n irk: string;\n}\n\nfunction isKedi(hayvan: Kedi | Kopek): hayvan is Kedi {\n return (hayvan as Kedi).miyawla !== undefined;\n}\n\nfunction hayvanSesiniCikar(hayvan: Kedi | Kopek): void {\n if (isKedi(hayvan)) {\n hayvan.miyawla(); \/\/ TypeScript burada 'hayvan'\u0131n bir 'Kedi' oldu\u011funu bilir\n console.log(Cinsi: ${hayvan.cins}<\/code>);\n } else {\n hayvan.havla(); \/\/ TypeScript burada 'hayvan'\u0131n bir 'Kopek' oldu\u011funu bilir\n console.log(Irk\u0131: ${hayvan.irk}<\/code>);\n }\n}\n\nconst tekir: Kedi = { miyawla: () => console.log(\"Miyav!\"), cins: \"Tekir\" };\nconst pitbull: Kopek = { havla: () => console.log(\"Hav hav!\"), irk: \"Pitbull\" };\n\nhayvanSesiniCikar(tekir); \/\/ Miyav! Cinsi: Tekir\nhayvanSesiniCikar(pitbull); \/\/ Hav hav! Irk\u0131: Pitbull\n<\/code><\/pre>\nisKedi<\/code> fonksiyonu, hayvan is Kedi<\/code> d\u00f6n\u00fc\u015f tipi imzas\u0131na sahiptir. Bu, fonksiyon true<\/code> d\u00f6nd\u00fcrd\u00fc\u011f\u00fcnde, TypeScript derleyicisinin hayvan<\/code> de\u011fi\u015fkenini Kedi<\/code> tipine daraltaca\u011f\u0131n\u0131 anlad\u0131\u011f\u0131 anlam\u0131na gelir. Bu sayede, if<\/code> blo\u011funun i\u00e7inde hayvan.miyawla()<\/code> gibi Kedi<\/code>'ye \u00f6zg\u00fc metodlara g\u00fcvenle eri\u015febiliriz.<\/p>\nFonksiyon Tipleri ve Aray\u00fczler<\/h3>\n
TypeScript'te fonksiyonlar\u0131n kendileri de tiplere sahip olabilir. Bu, fonksiyonlar\u0131 de\u011fi\u015fkenlere atarken, fonksiyon parametreleri olarak kullan\u0131rken veya nesne \u00f6zelliklerinin fonksiyon olmas\u0131n\u0131 belirtirken \u00e7ok kullan\u0131\u015fl\u0131d\u0131r. Fonksiyon tiplerini tan\u0131mlamak i\u00e7in tip takma adlar\u0131 (type<\/code>) veya aray\u00fczler (interface<\/code>) kullanabiliriz.<\/p>\nFonksiyon Tiplerini Tan\u0131mlama<\/h3>\n
Bir fonksiyonun tipini tan\u0131mlamak i\u00e7in arrow fonksiyon s\u00f6zdizimine benzer bir yap\u0131 kullanabiliriz:<\/p>\n
\ntype MatematikselIslem = (x: number, y: number) => number;\n\nconst toplaFonk: MatematikselIslem = (a, b) => a + b;\nconst cikarFonk: MatematikselIslem = (a, b) => a - b;\n\nconsole.log(toplaFonk(10, 5)); \/\/ 15\nconsole.log(cikarFonk(10, 5)); \/\/ 5\n\n\/\/ Bu tip, bir fonksiyonu parametre olarak alan ba\u015fka bir fonksiyon i\u00e7in de kullan\u0131labilir:\nfunction hesapla(islem: MatematikselIslem, sayi1: number, sayi2: number): number {\n return islem(sayi1, sayi2);\n}\n\nconsole.log(hesapla(toplaFonk, 20, 10)); \/\/ 30\n<\/code><\/pre>\nMatematikselIslem<\/code> tipi, iki number<\/code> parametresi alan ve bir number<\/code> d\u00f6nd\u00fcren herhangi bir fonksiyonu temsil eder. Bu, kodun daha mod\u00fcler ve anla\u015f\u0131l\u0131r olmas\u0131n\u0131 sa\u011flar.<\/p>\nAray\u00fczler ile Fonksiyon Tipleri<\/h3>\n
Aray\u00fczler de fonksiyon tiplerini tan\u0131mlamak i\u00e7in kullan\u0131labilir, \u00f6zellikle bir nesnenin belirli bir fonksiyon \u00f6zelli\u011fine sahip olmas\u0131n\u0131 bekledi\u011fimizde.<\/p>\n
\ninterface Karsilastirici {\n (a: string, b: string): boolean;\n}\n\nconst alfabetikKarsilastir: Karsilastirici = (s1, s2) => s1.localeCompare(s2) > 0;\nconst uzunlukKarsilastir: Karsilastirici = (s1, s2) => s1.length > s2.length;\n\nconsole.log(alfabetikKarsilastir(\"elma\", \"armut\")); \/\/ true (e > a)\nconsole.log(uzunlukKarsilastir(\"uzun\", \"k\u0131sa\")); \/\/ true (4 > 3)\n\n\/\/ Bir nesne i\u00e7indeki fonksiyonu tan\u0131mlamak i\u00e7in de kullan\u0131labilir:\ninterface HesapMakinesi {\n topla: MatematikselIslem;\n carp(x: number, y: number): number; \/\/ Direkt aray\u00fcz i\u00e7inde de tan\u0131mlanabilir\n}\n\nconst benimHesapMakinesi: HesapMakinesi = {\n topla: (a, b) => a + b,\n carp: (a, b) => a * b\n};\n\nconsole.log(benimHesapMakinesi.topla(5, 2)); \/\/ 7\nconsole.log(benimHesapMakinesi.carp(5, 2)); \/\/ 10\n<\/code><\/pre>\nHem type<\/code> hem de interface<\/code>, fonksiyon tiplerini tan\u0131mlamak i\u00e7in kullan\u0131labilir. Genellikle, basit fonksiyon tipleri i\u00e7in type<\/code> takma adlar\u0131 tercih edilirken, bir nesnenin par\u00e7as\u0131 olan fonksiyonlar i\u00e7in veya bir s\u0131n\u0131f\u0131n uygulamas\u0131 gereken bir davran\u0131\u015f k\u00fcmesini tan\u0131mlarken interface<\/code> daha uygun olabilir.<\/p>\nPratik \u0130pu\u00e7lar\u0131 ve En \u0130yi Uygulamalar<\/h3>\n
TypeScript'te fonksiyonlar\u0131 etkin bir \u015fekilde kullanmak sadece do\u011fru s\u00f6zdizimini bilmekle kalmaz, ayn\u0131 zamanda iyi uygulama prensiplerini benimsemeyi de gerektirir. Bu prensipler, kodun daha okunabilir, bak\u0131m\u0131 kolay ve hatas\u0131z olmas\u0131n\u0131 sa\u011flar.<\/p>\n
Okunabilirlik ve Bak\u0131m<\/h3>\n\n- A\u00e7\u0131k ve Anlaml\u0131 \u0130simler:<\/strong> Fonksiyonlar\u0131n\u0131za ve parametrelerinize ne i\u015f yapt\u0131klar\u0131n\u0131 a\u00e7\u0131k\u00e7a belirten isimler verin. \u00d6rne\u011fin,
hesapla<\/code> yerine toplamHesapla<\/code> veya kullaniciVerisiGetir<\/code>.<\/li>\n- K\u0131sa ve Tek Sorumluluk:<\/strong> Her fonksiyonun tek bir i\u015flevi olmal\u0131d\u0131r (Single Responsibility Principle). Uzun ve karma\u015f\u0131k fonksiyonlar yerine, daha k\u00fc\u00e7\u00fck, odaklanm\u0131\u015f fonksiyonlara b\u00f6l\u00fcn. Bu, test etmeyi ve anlamay\u0131 kolayla\u015ft\u0131r\u0131r.<\/li>\n
- Yorumlar ve JSDoc:<\/strong> Karma\u015f\u0131k mant\u0131k i\u00e7eren veya \u00f6zel gereksinimleri olan fonksiyonlar i\u00e7in a\u00e7\u0131klay\u0131c\u0131 yorumlar veya JSDoc kullan\u0131n. TypeScript, JSDoc'u tan\u0131r ve tip \u00e7\u0131kar\u0131m\u0131nda kullanabilir.<\/li>\n<\/ul>\n
\n\/<\/em>\n * Verilen iki say\u0131y\u0131 toplar ve sonucu d\u00f6nd\u00fcr\u00fcr.\n * @param {number} sayi1 - \u0130lk say\u0131.\n * @param {number} sayi2 - \u0130kinci say\u0131.\n * @returns {number} \u0130ki say\u0131n\u0131n toplam\u0131.\n *\/\nfunction topla(sayi1: number, sayi2: number): number {\n return sayi1 + sayi2;\n}\n<\/code><\/pre>\nSaf Fonksiyonlar<\/h3>\n
M\u00fcmk\u00fcn oldu\u011funca saf (pure) fonksiyonlar yazmaya \u00e7al\u0131\u015f\u0131n. Saf fonksiyonlar:<\/p>\n
\n- Ayn\u0131 girdilerle her zaman ayn\u0131 \u00e7\u0131kt\u0131y\u0131 \u00fcretirler.<\/li>\n
- D\u0131\u015f d\u00fcnyada herhangi bir yan etkiye (side effect) neden olmazlar (global de\u011fi\u015fkenleri de\u011fi\u015ftirmezler, konsola yazmazlar, a\u011f istekleri yapmazlar vb.).<\/li>\n<\/ul>\n
Saf fonksiyonlar daha kolay test edilebilir, \u00f6nbelle\u011fe al\u0131nabilir ve paralel olarak \u00e7al\u0131\u015ft\u0131r\u0131labilir.<\/p>\n
\n\/\/ Saf fonksiyon\nfunction kareAl(sayi: number): number {\n return sayi * sayi;\n}\n\n\/\/ Saf olmayan fonksiyon (yan etkisi var: global de\u011fi\u015fkeni de\u011fi\u015ftiriyor)\nlet sayac = 0;\nfunction artirSayac(): void {\n sayac++;\n}\n<\/code><\/pre>\nHata Y\u00f6netimi<\/h3>\n
Fonksiyonlar\u0131n\u0131zda beklenen hatalar\u0131 uygun bir \u015fekilde ele al\u0131n. try...catch<\/code> bloklar\u0131, Promise zincirleri veya async\/await<\/code> ile hata yakalama mekanizmalar\u0131n\u0131 kullanarak uygulaman\u0131z\u0131n kararl\u0131l\u0131\u011f\u0131n\u0131 sa\u011flay\u0131n. TypeScript, f\u0131rlat\u0131lan hatalar\u0131n tipini belirtmenize izin vermese de, yakalad\u0131\u011f\u0131n\u0131z hatalar\u0131 unknown<\/code> olarak ele al\u0131p tip korumalar\u0131 ile daraltman\u0131z g\u00fcvenli bir yakla\u015f\u0131md\u0131r.<\/p>\n\nasync function veriYukle(url: string): Promise {\n try {\n const response = await fetch(url);\n if (!response.ok) {\n throw new Error(HTTP Hata: ${response.status}<\/code>);\n }\n return await response.json();\n } catch (error: unknown) {\n if (error instanceof Error) {\n console.error(Veri y\u00fcklenirken bir hata olu\u015ftu: ${error.message}<\/code>);\n } else {\n console.error(\"Beklenmedik bir hata olu\u015ftu:\", error);\n }\n throw error; \/\/ Hatay\u0131 tekrar f\u0131rlat veya uygun \u015fekilde ele al\n }\n}\n<\/code><\/pre>\nSonu\u00e7<\/h3>\n
TypeScript, fonksiyonlara statik tipleme g\u00fcc\u00fc ekleyerek JavaScript geli\u015ftirme deneyimini k\u00f6kten de\u011fi\u015ftirir. Bu makalede, fonksiyonlar\u0131n temel tan\u0131mlamalar\u0131ndan ba\u015flayarak, parametre ve d\u00f6n\u00fc\u015f tiplerinin detaylar\u0131na, arrow fonksiyonlar\u0131n modern kullan\u0131m\u0131na, fonksiyon a\u015f\u0131r\u0131 y\u00fcklemesinin ve jenerik fonksiyonlar\u0131n esnekli\u011fine, callback'ler ve y\u00fcksek mertebeden fonksiyonlar\u0131n g\u00fcc\u00fcne, asenkron programlaman\u0131n async\/await<\/code> ile nas\u0131l daha okunabilir hale geldi\u011fine ve tip korumalar\u0131n\u0131n \u00e7al\u0131\u015fma zaman\u0131 tip daraltmas\u0131ndaki \u00f6nemine de\u011findik. Ayr\u0131ca, fonksiyon tiplerini tan\u0131mlamak i\u00e7in type<\/code> ve interface<\/code> kullan\u0131mlar\u0131n\u0131 inceledik ve son olarak, okunabilirlik, saf fonksiyonlar ve hata y\u00f6netimi gibi pratik ipu\u00e7lar\u0131yla en iyi uygulamalar\u0131 tart\u0131\u015ft\u0131k.<\/p>\nTypeScript'te fonksiyonlar\u0131 etkin bir \u015fekilde kullanmak, sadece derleme zaman\u0131 hatalar\u0131n\u0131 azaltmakla kalmaz, ayn\u0131 zamanda kodunuzu daha anla\u015f\u0131l\u0131r, bak\u0131m\u0131 daha kolay ve gelecekteki de\u011fi\u015fikliklere daha diren\u00e7li hale getirir. Tip g\u00fcvenli\u011finin sa\u011flad\u0131\u011f\u0131 bu avantajlar, \u00f6zellikle b\u00fcy\u00fck ve karma\u015f\u0131k projelerde geli\u015ftirme verimlili\u011fini ve g\u00fcvenilirli\u011fi \u00f6nemli \u00f6l\u00e7\u00fcde art\u0131r\u0131r. TypeScript'in fonksiyonlarla ilgili sundu\u011fu t\u00fcm bu \u00f6zellikleri derinlemesine anlamak ve projelerinizde uygulamak, daha sa\u011flam ve s\u00fcrd\u00fcr\u00fclebilir yaz\u0131l\u0131mlar geli\u015ftirmenizin anahtar\u0131 olacakt\u0131r.<\/p>\n
<\/body><\/p>\n","protected":false},"excerpt":{"rendered":"TypeScript’te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi\nGiri\u015f\nModern web uygulamalar\u0131n\u0131n karma\u015f\u0131kl\u0131\u011f\u0131 artt\u0131k\u00e7a, kod taban\u0131n\u0131n y","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_page_header_type":"","csco_page_load_nextpost":"","csco_page_subscribe_form":"","csco_page_contact_form":"","footnotes":""},"categories":[1],"tags":[],"class_list":{"0":"post-38242","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-genel","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"\n
TypeScript'te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi - Kodlar\u0131n Gizemli D\u00fcnyas\u0131<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"TypeScript'te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi\" \/>\n<meta property=\"og:description\" content=\"TypeScript'te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi Giri\u015f Modern web uygulamalar\u0131n\u0131n karma\u015f\u0131kl\u0131\u011f\u0131 artt\u0131k\u00e7a, kod taban\u0131n\u0131n y\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2026-01-26T13:41:01+00:00\" \/>\n<meta name=\"author\" content=\"Fatih Soysal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fatih Soysal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"20 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"TypeScript’te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi\",\"datePublished\":\"2026-01-26T13:41:01+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/\"},\"wordCount\":2665,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/#respond\"]}],\"copyrightYear\":\"2026\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/\",\"name\":\"TypeScript'te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi - Kodlar\u0131n Gizemli D\u00fcnyas\u0131\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2026-01-26T13:41:01+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"TypeScript’te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/\",\"name\":\"Fatihsoysal.com\",\"description\":\"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim\",\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\",\"name\":\"Fatih Soysal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"width\":512,\"height\":512,\"caption\":\"Fatih Soysal\"},\"logo\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"TypeScript'te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/","og_locale":"tr_TR","og_type":"article","og_title":"TypeScript'te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi","og_description":"TypeScript'te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi Giri\u015f Modern web uygulamalar\u0131n\u0131n karma\u015f\u0131kl\u0131\u011f\u0131 artt\u0131k\u00e7a, kod taban\u0131n\u0131n y","og_url":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2026-01-26T13:41:01+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"20 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"TypeScript’te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi","datePublished":"2026-01-26T13:41:01+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/"},"wordCount":2665,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/#respond"]}],"copyrightYear":"2026","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/","url":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/","name":"TypeScript'te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2026-01-26T13:41:01+00:00","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/typescriptte-fonksiyonlari-etkin-bir-sekilde-kullanma-rehberi\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"TypeScript’te Fonksiyonlar\u0131 Etkin Bir \u015eekilde Kullanma Rehberi"}]},{"@type":"WebSite","@id":"https:\/\/fatihsoysal.com\/blog\/#website","url":"https:\/\/fatihsoysal.com\/blog\/","name":"Fatihsoysal.com","description":"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim","publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":["Person","Organization"],"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1","name":"Fatih Soysal","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","width":512,"height":512,"caption":"Fatih Soysal"},"logo":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/"},"description":"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.","url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/"}]}},"yoast_meta":{"yoast_wpseo_title":"","yoast_wpseo_metadesc":"","yoast_wpseo_canonical":""},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/38242","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/comments?post=38242"}],"version-history":[{"count":1,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/38242\/revisions"}],"predecessor-version":[{"id":38243,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/38242\/revisions\/38243"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=38242"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=38242"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=38242"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}