Temel tipler ve tip çıkarımı

JavaScript'te bir değişken bugün sayı, yarın string, öbür gün nesne tutabilir; kimse itiraz etmez. Küçük bir betikte bu rahattır ama büyük bir programda karışıklık yaratır: score içinde ne olduğunu bilmek için tüm kodu izlemen gerekir. TypeScript'te her değişkenin bir tipi vardır ve bu tip değişkenin ömrü boyunca aynı kalır. İşin en güzel yanı: çoğu zaman tipleri kendin yazmak zorunda bile değilsin.

İlkel tipler

JavaScript kursundan tanıdığın ilkel değerlerin her birinin TypeScript'te kendi tipi vardır. En sık kullanacağın üç tip şunlardır: metin için string, tam ya da ondalıklı her sayı için number, true/false için boolean. Tip adları küçük harfle yazılır.

let city: string = 'Baku';
let temperature: number = 23.5;
let isSunny: boolean = true;

temperature = 25;
console.log(`${city}: ${temperature}°C, sunny: ${isSunny}`);

Baku: 25°C, sunny: true

Tip çıkarımı

let score = 10;
score = score + 5;
score = 'fifteen';

score.ts:3:1 - error TS2322: Type 'string' is not assignable to type 'number'.

3 score = 'fifteen';
  ~~~~~

Editörde imleci bir değişkenin üzerine getirirsen TypeScript'in çıkardığı tipi görürsün: let score: number. Kural basit: değişkene hemen bir değer veriyorsan tipi yazma, çıkarım yeterlidir. Tipi, değer verilmeden tanımlanan değişkenlere ve fonksiyon parametrelerine yaz; parametreleri bir sonraki derste göreceğiz.

Diziler ve demetler

Dizi tipi, eleman tipinin ardından köşeli parantezle yazılır: number[], sayılardan oluşan bir dizidir. Aynı şey Array<number> olarak da yazılabilir. Demet (tuple) ise uzunluğu ve her konumunun tipi önceden bilinen bir dizidir: [string, number], önce bir string, sonra bir sayı, toplam iki eleman demektir.

const scores: number[] = [90, 75, 88];
const names: Array<string> = ['Aysel', 'Murad'];
scores.push(100);

const entry: [string, number] = ['Leyla', 17];
const [name, age] = entry;

console.log(scores.length, names[1]);
console.log(`${name} is ${age}`);

4 Murad
Leyla is 17

const scores: number[] = [90, 75, 88];
scores.push('ninety');

const point: [number, number] = [40.4, 49.9, 0];

lists.ts:2:13 - error TS2345: Argument of type 'string' is not assignable to parameter of type 'number'.

2 scores.push('ninety');
              ~~~~~~~~

lists.ts:4:7 - error TS2322: Type '[number, number, number]' is not assignable to type '[number, number]'.
  Source has 3 element(s) but target allows only 2.

4 const point: [number, number] = [40.4, 49.9, 0];
        ~~~~~

any ve unknown

Bazen bir değerin tipi önceden bilinmez; örneğin bir sunucudan ya da JSON.parse'tan gelir. Bunun için iki özel tip vardır. any denetimi tamamen kapatır: böyle bir değerle her işlemi yazabilirsin, hatalar da yine çalışma anında ortaya çıkar. unknown ise “henüz bilmiyorum” demektir: ona her değer atanabilir ama kullanmadan önce tipini kontrol etmek zorunludur.

let risky: any = 'hello';
let fromServer: unknown = 'hello';

risky.toFixed(2);
fromServer.toUpperCase();

data.ts:5:1 - error TS18046: 'fromServer' is of type 'unknown'.

5 fromServer.toUpperCase();
  ~~~~~~~~~~

unknown ile doğru çalışma şöyle görünür: önce typeof ile kontrol edersin, if bloğunun içinde ise TypeScript değerin tipini artık tam olarak bilir.

function describe(value: unknown): string {
  if (typeof value === 'string') {
    return `a string of length ${value.length}`;
  }
  if (typeof value === 'number') {
    return `the number ${value.toFixed(1)}`;
  }
  return 'something else';
}

console.log(describe('Baku'));
console.log(describe(3.14159));
console.log(describe(true));

a string of length 4
the number 3.1
something else

Literal tipler

Bir tip tek bir kesin değer de olabilir. 'left' | 'right' tipi yalnızca bu iki string'den birini kabul eder; | işareti “veya” demektir. Bu tür literal tipler yazım hatalarına karşı korur ve editör olası değerleri kendisi önerir. İlginçtir ki const planet = 'Earth' yazdığında planet'in tipi string değil, tam olarak 'Earth' olur; ne de olsa bir sabit asla değişmez. let ile ise tip string olurdu.

let direction: 'left' | 'right' = 'left';
direction = 'right';
direction = 'up';

direction.ts:3:1 - error TS2322: Type '"up"' is not assignable to type '"left" | "right"'.

3 direction = 'up';
  ~~~~~~~~~