TypeScript Temel Tipler: İlkel Tipler, Diziler, Nesneler ve Çıkarım

İlkel tipler: string, number, boolean

JavaScript'in en sık kullanılan üç ilkel değeri TypeScript'te aynı adlı tiplerle karşılanır. Adlar, JavaScript'in typeof operatörünün döndürdüğü adlarla aynıdır. Tamsayı ve ondalıklı sayı için ayrı tip yoktur; JavaScript'te olduğu gibi hepsi number'dır.

let urunAdi: string = "Klavye";
let fiyat: number = 749.9;
let stoktaVar: boolean = true;

let adet = 3;          // çıkarım: number
const kdvOrani = 0.2;  // çıkarım: 0.2 (sabit)

console.log(typeof urunAdi, typeof fiyat, typeof stoktaVar);
// string number boolean
console.log(fiyat * adet * (1 + kdvOrani));
// 2699.64

Daha az kullanılan iki ilkel tip daha var: çok büyük tamsayılar için bigint ve benzersiz anahtarlar için symbol. bigint literalleri için ES2020 veya üstü bir hedef gerekir; TypeScript 6.0'ın varsayılan hedefi bunu karşılar.

const buyuk: bigint = 9007199254740993n;
console.log(buyuk * 2n); // 18014398509481986n

const anahtar1 = Symbol("id");
const anahtar2 = Symbol("id");
if (anahtar1 === anahtar2) {
  // TS2367: This comparison appears to be unintentional because the types
  // 'typeof anahtar1' and 'typeof anahtar2' have no overlap.
}

Her Symbol() çağrısı benzersiz bir değer ürettiği için bu karşılaştırma hiçbir zaman doğru olamaz ve TypeScript bunu fark eder. JavaScript tarafındaki ayrıntılar için sayılar ve BigInt ile Symbol yazılarına bakabilirsiniz.

Diziler

Bir dizinin tipini, eleman tipinin arkasına [] ekleyerek yazarsınız: number[], string[]. Aynı anlama gelen ikinci yazım Array<number> biçimidir; bu sözdizimi generics konusunda netleşir (TypeScript generics).

const puanlar: number[] = [90, 75, 60];
const etiketler: Array<string> = ["yeni", "indirimde"];

puanlar.push(88);
etiketler.push(5);
// TS2345: Argument of type 'number' is not assignable to parameter of type 'string'.

Tip ek açıklaması mı, tip çıkarımı mı?

Değişken tanımlarken const, let veya var ile birlikte tip yazabilirsiniz. TypeScript, C veya Java'daki gibi tipi sola (int x = 0;) değil, her zaman adın sağına yazar. Ama çoğu durumda buna gerek yoktur: değişken bir değerle başlatıldığında tipi o değerden çıkarılır.

let adet = 3;   // number olarak çıkarıldı
adet = "üç";
// TS2322: Type 'string' is not assignable to type 'number'.

Handbook'un önerisi açık: başlangıçta düşündüğünüzden daha az tip ek açıklaması kullanın, derleyicinin ne kadar çok şeyi kendi anladığına şaşırabilirsiniz. Derleyicinin zaten aynı tipi çıkaracağı yerlerde tip yazmak bilgi eklemez. Tip yazmanın gerçekten gerekli olduğu yerler şunlardır:

• Fonksiyon parametreleri: çıkarılacak bir başlangıç değeri yoktur.
• Değeri sonradan atanacak değişkenler: let sonuc: string;
• Çıkarılan tipin istediğinizden geniş veya dar olduğu durumlar.
• Dışa açılan fonksiyonların dönüş tipi: belge işlevi görür ve yanlışlıkla değişmesini önler.

Fonksiyonlarda tipler

Parametre tipleri her parametrenin adından sonra, dönüş tipi parametre listesinden sonra yazılır. Parametreye tip verildiğinde çağrılar denetlenir; tip vermeseniz bile TypeScript doğru sayıda argüman geçirip geçirmediğinizi kontrol eder. async fonksiyonların dönüş tipi Promise<T> ile yazılır.

function toplam(a: number, b: number): number {
  return a + b;
}

async function stokGetir(): Promise<number> {
  return 42;
}

console.log(toplam(2, 3)); // 5
stokGetir().then((n) => console.log(n)); // 42

toplam("2", 3);
// TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.

Bir fonksiyon, nasıl çağrılacağı belli olan bir yerde yazıldığında (örneğin forEach'e verilen geri çağırma), parametreleri otomatik tip alır. Buna bağlamsal tipleme (contextual typing) denir:

const sehirler = ["Ankara", "İzmir", "Bursa"];

sehirler.forEach((s) => {
  console.log(s.toLocaleUpperCase("tr-TR")); // s: string
});

sehirler.forEach((s) => {
  console.log(s.toUppercase());
  // TS2551: Property 'toUppercase' does not exist on type 'string'. Did you mean 'toUpperCase'?
});

Overload, varsayılan ve rest parametreleri gibi konular fonksiyon tipleri ve overload yazısında.

Nesne tipleri

İlkel tipler dışındaki en yaygın tip nesne tipidir. Bir nesne tipi yazmak için özelliklerini ve tiplerini listelersiniz. Özellikleri , veya ; ile ayırabilirsiniz, sondaki ayırıcı isteğe bağlıdır. Bir özelliğin tipini yazmazsanız any kabul edilir.

function nokta(p: { x: number; y: number }) {
  return p.x + p.y;
}

nokta({ x: 1, y: 2 });
nokta({ x: 1, y: 2, z: 3 });
// TS2353: Object literal may only specify known properties,
// and 'z' does not exist in type '{ x: number; y: number; }'.

Burada dikkat edilmesi gereken bir ayrıntı var. TypeScript tip uyumluluğunu yapısal olarak belirler ve fazladan özellik taşıyan bir değişkeni kabul eder (TypeScript nedir yazısındaki Nokta örneği). Ama nesneyi doğrudan çağrının içinde literal olarak yazdığınızda bilinmeyen özellikler hata sayılır; çünkü bu durumda büyük olasılıkla bir yazım hatası yapmışsınızdır.

Aynı şekli birden çok yerde kullanacaksanız ona bir ad verirsiniz: type takma adı veya interface. Hangisini ne zaman seçeceğiniz interface ve type farkı yazısının konusu.

İsteğe bağlı özellikler

Bir özelliğin adının arkasına ? koyarak onu isteğe bağlı yaparsınız. JavaScript'te olmayan bir özelliği okumak hata vermez, undefined döner; bu yüzden isteğe bağlı bir özelliği kullanmadan önce kontrol etmeniz gerekir:

function kartYaz(kisi: { ad: string; soyad?: string }) {
  console.log(kisi.soyad.toUpperCase());
  // TS18048: 'kisi.soyad' is possibly 'undefined'.
}

function kartYaz(kisi: { ad: string; soyad?: string }) {
  if (kisi.soyad !== undefined) {
    return `${kisi.ad} ${kisi.soyad.toUpperCase()}`;
  }
  return kisi.ad;
}

console.log(kartYaz({ ad: "Elif" }));                 // Elif
console.log(kartYaz({ ad: "Elif", soyad: "Kaya" })); // Elif KAYA

Kısa yol olarak optional chaining de kullanılabilir: kisi.soyad?.toUpperCase(). Bu operatörün JavaScript tarafı optional chaining ve nullish yazısında anlatılıyor. Kontrolden sonra tipin nasıl daraldığını ise narrowing yazısında bulabilirsiniz.

any: denetimden çıkış kapısı

any tipindeki bir değerle her şeyi yapabilirsiniz: olmayan metotları çağırabilir, istediğiniz tipe atayabilirsiniz. Derleyici hiçbirini denetlemez. Aşağıdaki kod hatasız derlenir ama çalışınca ikinci satırda çöker:

let veri: any = { x: 0 };
veri.olmayanMetot();   // derleme hatası yok
const sayi: number = veri; // bu da hatasız

Tipi bilinmeyen bir değer için any yerine unknown kullanın; ayrıntılar any, unknown ve never yazısında.

Kısaca diğer temel yapılar

İlgili yazılar: union ve intersection, literal tipler, null ve undefined, type assertion, enum. Handbook, enum'un tip sistemine değil çalışma zamanına bir şey eklediğini, bu yüzden emin olmadan kullanmamayı önerir.

Sık yapılan hatalar

• String yazmak: Tip olarak her zaman küçük harfli string, number, boolean kullanın.
• Gereksiz tip yazmak: let ad: string = "Ali" yerine let ad = "Ali" yeterlidir.
• İsteğe bağlı özelliği kontrolsüz kullanmak: ? ile işaretli alan undefined olabilir.
• [number] ile number[] karıştırmak: İlki tek elemanlı tuple, ikincisi dizi.
• any ile hatayı susturmak: any yayılır; ondan okunan her özellik de any olur.

Sık Sorulan Sorular

TypeScript'te int veya float tipi var mı?

Hayır. JavaScript'te tamsayılar için ayrı bir çalışma zamanı değeri olmadığı için tek sayı tipi number'dır. Çok büyük tamsayılar için bigint kullanılır.

number[] ile Array<number> arasında fark var mı?

Hayır, ikisi aynı tipi ifade eder. Hangisini kullanacağınız ekip tercihidir; kısa olduğu için genellikle number[] yazılır.

Fonksiyonların dönüş tipini her zaman yazmalı mıyım?

Zorunlu değil; TypeScript dönüş tipini return ifadelerinden çıkarır. Bazı ekipler belge işlevi görmesi ve yanlışlıkla değişmesini önlemek için dışa açılan fonksiyonlarda dönüş tipini açıkça yazar.

Nesne tipinde özellikleri virgülle mi noktalı virgülle mi ayırmalıyım?

İkisi de geçerlidir ve son ayırıcı isteğe bağlıdır. Projede tutarlı olmanız yeterli.

Marka adları sahiplerine aittir. Bu yazı bağımsız bir teknik rehberdir; adı geçen kuruluşlarla bayilik veya ortaklık ilişkisi bulunduğu anlamına gelmez.

İlgili içerikler: TypeScript öğrenme rehberi · TypeScript nedir · interface ve type farkı · union tipleri · JavaScript veri tipleri