Konu Başlıkları
Bu makalemizde, TypeScript’de kullanılan tipler, bunların açık (explicit) ve gizli (implicit) tanımlama şekilleri ve çoklu tip tanımı gibi konular ile yazdığımız koda belirlediğimiz standartları ve kuralları getirmeye başlayacağız. Öğrendiğimiz bilgiler, serinin bundan sonraki makalelerinde kullanılmaya devam edilecek.
Tipler
TypeScript’te tip kullanımı, değişken veya sabit ismini takip eden “:” işareti ve arkasından gelen tip adının yazılması ile sağlanır. Derleme sırasında belirtilen tipe uygun olmayan atamalar kontrol edilip, aksi kullanım durumunda hata verilerek, istenmeyen durumların oluşması geliştirme ortamında engellenmiş olur.
TypeScript’de hali hazırda kullanılan tipleri (şimdilik) yedi parçada özetleyebiliriz.
- number
- string
- boolean
- Date
- unknown
- any
- null ve undefined
number: Farklı formatlarda sayısal tipteki verileri saklamak için kullanılır. Aşağıda geçerli ve geçersiz atama şekilleri gösterilmiştir.
// Aşağıdaki ifadelerin tamamı geçerli birer sayısal değerdir
let value1: number = 7; // Tam sayı
let value2: number = 3.14159265359; // Ondalık sayı
let value3: number = 0x1234ABC; // Onaltılık sayı tabanındaki sayı
let value4: number = 0o123456; // Sekizlik sayı tabanındaki sayı
let value5: number = 0b101010; // İkilik sayı tabanındaki sayı
// Aşağıdaki ifadelerin tamamı derleme sırasında hataya sebep olur
let value6: number = "Metinsel ifade"; // Hata: Metinsel ifade sayısal değer değil
let value7: number = true; // Hata: Mantıksal ifade sayısal değer değil
let value8: number = null; // Hata: null sayısal değer değil
let value9: number = undefined; // Hata: undefined sayısal değer değil
let value10: number = [1, 2, 3]; // Hata: Dizi sayısal değer değil
let value11: number = { name: "John", age: 30 }; // Hata: Nesne sayısal değer değil
string: Metinsel tipte veri saklamak için kullanılır. Metinsel ifadeler için çift veya tek tırnak kullanımı arasında bir fark yoktur. ` işareti ile JavaScript’te olduğu gibi template literal ifadeleri kullanılabilir.
// Aşağıdaki ifadelerin tamamı geçerli birer metinsel değerdir
let value1: string = "Metinsel ifade"; // Metinsel ifade
let value2: string = 'Metinsel ifade'; // Metinsel ifade
let value3: string = `Metinsel ifade ${value1}`; // Template Literal metinsel ifade
// Aşağıdaki ifadelerin tamamı derleme sırasında hataya sebep olur
let value4: string = 7; // Hata: Sayısal ifade metinsel değer değil
let value5: string = true; // Hata: Mantıksal ifade metinsel değer değil
let value6: string = null; // Hata: null metinsel değer değil
let value7: string = undefined; // Hata: undefined metinsel değer değil
let value8: string = [1, 2, 3]; // Hata: Dizi metinsel değer değil
let value9: string = { name: "John", age: 30 }; // Hata: Nesne metinsel değer değil
boolean: Sadece true veya false değerlerini içerebilen mantıksal verileri saklamak için kullanılır.
// Aşağıdaki ifadelerin tamamı geçerli birer mantıksal değerdir
let value1: boolean = true; // Mantıksal ifade
let value2: boolean = false; // Mantıksal ifade
// Aşağıdaki ifadelerin tamamı derleme sırasında hataya sebep olur
let value3: boolean = "Metinsel ifade"; // Hata: Metinsel ifade mantıksal değer değil
let value4: boolean = 7; // Hata: Sayısal ifade mantıksal değer değil
let value5: boolean = null; // Hata: null mantıksal değer değil
let value6: boolean = undefined; // Hata: undefined mantıksal değer değil
let value7: boolean = [1, 2, 3]; // Hata: Dizi mantıksal değer değil
let value8: boolean = {name: "John", age: 30}; // Hata: Nesne mantıksal değer değil
Date: Tarih tipindeki verileri saklamak için kullanılır.
// Aşağıdaki ifadelerin tamamı geçerli birer tarihsel değerdir
let value1: Date = new Date(); // Tarihsel ifade
let value2: boolean = new Date(2023,3,22); // Tarihsel ifade
// Aşağıdaki ifadelerin tamamı derleme sırasında hataya sebep olur
let value3: Date = "Metinsel ifade"; // Hata: Metinsel ifade tarihsel değer değil
let value4: Date = 7; // Hata: Sayısal ifade tarihsel değer değil
let value5: Date = null; // Hata: null tarihsel değer değil
let value6: Date = undefined; // Hata: undefined tarihsel değer değil
let value7: Date = [1, 2, 3]; // Hata: Dizi tarihsel değer değil
let value8: Date = {name: "John", age: 30}; // Hata: Nesne tarihsel değer değil
unknown: Bir değişkenin veya sabitin herhangi bir veri tipindeki değerleri saklamasını istediğimiz zaman kullanacağımız veri tipidir. Bu veri tipinde bir atama yaptıktan sonra kullanmadan önce gerekli kontrollerin yapılması gerekir, aksi taktirde derleme sırasında hata oluşur. Aşağıda konu hakkında örnekler verilmiştir.
let value1: unknown = 7; // value1 değişkeninin değerine sayısal bir değer atadık
value1 = "Metinsel ifade"; // Ardından value1 değişkeninin değerine metinsel bir değer atadık
let value2: number;
let value3: string;
if (typeof value1 === "number") {
// Tip kontrolü yaparak value1 değişkeninin değerini sayısal tipteki değişkene atayabiliriz
value2 = value1;
}
if (typeof value1 === "string") {
// Tip kontrolü yaparak value1 değişkeninin değerini metinsel tipteki değişkene atayabiliriz
value3 = value1;
}
// Aşağıdaki iki satır da, kontrol yapılmaksızın atama yapıldığı için derleme sırasında hataya sebep olur
value2 = value1;
value3 = value1;
any: TypeScript’deki tip kontrolünü komple devre dışı bırakmamızı ve derleme sırasında hiçbir kontrol yapılmamasını sağlar. Aslında TypeScript’de kod yazmamızın anlamını kaybetmesine sebep olan any tipi mümkün mertebe kullanılmaması gereken bir tiptir. Ancak dış servislerden gelecek verilerin tiplerini tahmin edemeyeceğimiz durumlarda kullanılması kaçınılmaz olabilir.
let value1: any = 7; // value1 değişkeninin değerine sayısal bir değer atadık
value1 = "Metinsel ifade"; // Ardından value1 değişkeninin değerine metinsel bir değer atadık
let value2: number;
let value3: string;
// Tip kontrolü yapılmadığı için Aşağıdaki iki satır da derleme sırasında hataya sebep olmaz
value2 = value1;
value3 = value1;
null ve undefined: Bu iki özel tip, belirtilen değişken veya sabite null veya undefined değerlerinin atanabilmesini sağlar. Bu iki tipe, makalenin sonundaki çoklu tip tanımı konusunda tekrar değineceğiz.
Açık (Explicit) ve Gizli (Implicit) Tanımlama Şekilleri
TypeScript’de tiplerin açık ve gizli şekilde tanımlanması mümkündür. Yukarıdaki örneklerin tamamı açık tanımlama şekline örnektir. Bu yöntemde değişken veya sabit tanımlama sırasında değişkenin tipini elle tanımlarız.
Gizli tanımlama şeklinde ise, elle tip tanımlaması yapmayız ancak atanan değere bakarak TypeScript tipin ne olduğuna bizim yerimize karar verir. Dikkat edilmesi gereken husus, tip açıkça ifade edilmese bile derleyici tarafından varlığı sabittir ve sonradan farklı tipte bir değer atanması sırasında hataya sebep olur.
let value1 = 7; // Tip elle belirtilmese dahi, atanan değer sebebiyle value1 değişkeninin tipi number olarak algılanır
let value2 = "Metinsel ifade"; // Benzer şekilde value2 değişkeninin tipi string olarak algılanır
// Aşağıdaki ifadeler, ilk algılanan tipten farklı olması sebebiyle derleme sırasında hataya sebep olur
value1 = "Geçersiz ifade";
value2 = false;
Not: Açık ve gizli tanımlama şekilleri arasında çalışma mantığında bir fark olmamasının yanında, kodun daha okunaklı olması için açık tanımlama şeklinin kullanılması tavsiye edilir.
Çoklu Tip Tanımı
TypeScript’de bir değişkenin, any veya unknown tiplerini kullanmadan birden fazla tipte değer saklamasını sağlayabiliriz. Bu kullanım şekli, sadece belirttiğimiz tiplerde değer atanmasına izin verdiği için, unknown’a göre daha güçlü bir tip kontrolü elde etmemize izin verir. Birden fazla tip tanımı için tipler arasında “|” işaretini kullanırız.
let value1: string | number; // value1 değişkeni metinsel veya sayısal tipte olabilir
value1 = 7; // Sayısal değer sorunsuzca atanabilir
value1 = "Metinsel ifade"; // Metinsel değer de sorunsuzca atanabilir
value1 = true; // Bu iki tip haricindeki tüm tipler derleme sırasında hataya sebep olurDaha önceden null ve undefined tiplerinden bahsetmiştik. Çoklu tip tanımı sayesinde bir değişkenin belirtilen tipte değer taşıması veya null/undefined değer içermesi sağlanabilir.
let value1: number | null; // value1 değişkeni sayısal değer veya null değeri içerebilir
let value2: number | undefined; // value2 değişkeni sayısal değer veya undefined değeri içerebilir
value1 = 7; // Sayısal değer sorunsuzca atanabilir
value1 = null; // null değer de sorunsuzca atanabilir
value2 = 3; // Sayısal değer sorunsuzca atanabilir
value2 = undefined; // undefined değer de sorunsuzca atanabilir
Böylece TypeScript ile gelen temel tiplerin üzerinden geçmiş olduk. Bir sonraki makalemizde kendi kompleks tiplerimizi oluşturma ve kullanma konusuna geçeceğiz.
Herkese iyi çalışmalar…
1 yorum
mukemmel