TypeScript Programlama Dilinde Mülakat Soru Rehberi

Can Gül
Can Gül
TypeScript Programlama Dilinde Mülakat Soru Rehberi

TypeScript, modern web ve mobil uygulama geliştirme süreçlerinde giderek daha popüler hale gelen güçlü bir programlama dilidir. JavaScript'in bir üst kümesi olarak kabul edilen TypeScript, statik tür denetimi, daha iyi hata yönetimi ve gelişmiş kod tamamlama gibi avantajlar sunar. Özellikle büyük ölçekli projelerde tercih edilen TypeScript, React ve Node.js gibi popüler teknolojilerle entegre çalışarak geliştiricilere daha güvenli ve okunabilir bir kod yapısı sağlar.

Bu yazımızda, TypeScript ile ilgili en sık sorulan mülakat sorularını ve detaylı yanıtlarını sizler için derledik. TypeScript’in temel kavramlarından ileri seviye tekniklerine kadar geniş bir perspektif sunarak mülakatlarda ve gerçek dünya projelerinde başarılı olmanıza yardımcı olacak ipuçlarını paylaşıyoruz. Eğer TypeScript'e yeni başlıyorsanız veya mevcut bilginizi güçlendirmek istiyorsanız, bu rehber tam size göre!

1. TypeScript nedir ve JavaScript'ten farkları nelerdir?

TypeScript, Microsoft tarafından geliştirilen, açık kaynaklı ve statik olarak tür denetimi yapabilen bir programlama dilidir. JavaScript’in bir üst kümesi (superset) olarak kabul edilir ve JavaScript kodlarını daha güvenli, okunabilir ve ölçeklenebilir hale getirmek için kullanılır.

Farkları:

Tür Desteği:

  • TypeScript: Statik tip sistemine sahiptir. Değişkenlerin türleri önceden tanımlanabilir.
  • JavaScript: Dinamik tip sistemine sahiptir. Değişken türleri çalışma zamanında belirlenir.

Kod Hataları:

  • TypeScript: Derleme (transpile) aşamasında hatalar tespit edilebilir.
  • JavaScript: Hatalar genellikle uygulama çalıştırıldığında fark edilir.

Gelişmiş ES Özellikleri:

  • TypeScript: ES6+ özelliklerini destekler ve transpile ederek eski ortamlara uyum sağlar.
  • JavaScript: ES özelliklerinin desteği, kullanılan tarayıcı veya çalışma ortamına bağlıdır.

Modülerlik:

  • TypeScript: Interface, Enum ve Type gibi yapılarla daha modüler bir yapı sunar.
  • JavaScript: Yalnızca ES modüllerini destekler.

Kod Tamamlama (IDE Desteği):

  • TypeScript: IDE’ler tarafından daha güçlü kod tamamlama özellikleriyle desteklenir.
  • JavaScript: Kod tamamlama desteği daha sınırlıdır.

Özet: TypeScript, JavaScript’in güçlü ve eksik yönlerini geliştirerek daha sağlam, hataya dayanıklı ve büyük ölçekli projelere uygun hale getirilmiş bir dildir.

2. TypeScript’in avantajları nelerdir?

  • Statik Tür Kontrolü: Hatalar derleme aşamasında tespit edilir.
  • Daha İyi Kod Tamamlama: IDE ve editörlerde gelişmiş otomatik tamamlama (IntelliSense) desteği sağlar.
  • Daha İyi Okunabilirlik ve Bakım: Büyük projelerde daha kolay okunabilir ve yönetilebilir kodlar yazılmasını sağlar.
  • ES6+ Desteği: Yeni nesil JavaScript özelliklerini kullanmanıza izin verir ve eski tarayıcılar için derleyebilir.
  • Modüler Yapı: Interface, Type, Enum, Namespace gibi gelişmiş tip desteği ile daha yapılandırılmış kodlar oluşturabilirsiniz.

3. TypeScript nasıl derlenir ve çalıştırılır?

TypeScript dosyaları .ts uzantısı ile yazılır ve bir TypeScript derleyicisi (tsc) kullanılarak JavaScript’e çevrilir.

Kurulum:

<code class="language-javascript" style="white-space:pre"><span>npm install -g typescript</span></code>

Derleme (Transpile) İşlemi:

<code class="language-javascript" style="white-space:pre"><span>tsc dosya.ts</span></code>

Bu komut dosya.ts adlı TypeScript dosyasını JavaScript (dosya.js) dosyasına çevirir.

TypeScript Kodu Çalıştırma:

<code class="language-javascript" style="white-space:pre"><span>node dosya.js</span></code>

Eğer ts-node modülü yüklü ise TypeScript kodunu direkt çalıştırabilirsiniz:

<code class="language-javascript" style="white-space:pre"><span>npx ts-node dosya.ts</span></code>

4. TypeScript’te veri tipleri (primitive ve non-primitive) nelerdir?

TypeScript'te veri tipleri primitive (ilkel) ve non-primitive (referans) türler olarak ikiye ayrılır.

Primitive (İlkel) Veri Tipleri:

- string – Metinleri temsil eder.

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> mesaj: string = </span><span style="color:#abe338">"Merhaba TypeScript"</span><span>;</span></code>

- number – Tamsayı ve ondalıklı sayıları ifade eder.

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> sayi: number = </span><span style="color:#f5ab35">42</span><span>;
</span></code>

- boolean – true veya false değerlerini alır.

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> aktif: boolean = </span><span style="color:#f5ab35">true</span><span>;
</span></code>

- null & undefined – Değişkenin boş veya tanımsız olduğunu belirtir.

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> bos: </span><span style="color:#f5ab35">null</span><span> = </span><span style="color:#f5ab35">null</span><span>;
</span><span></span><span style="color:#dcc6e0">let</span><span> tanimsiz: </span><span style="color:#f5ab35">undefined</span><span> = </span><span style="color:#f5ab35">undefined</span><span>;
</span></code>

- symbol & bigint – Özel tiplerdir, genellikle düşük seviyeli işlemlerde kullanılır.

Non-Primitive (Referans) Veri Tipleri:

  • Array (Dizi):
<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> sayilar: number[] = [</span><span style="color:#f5ab35">1</span><span>, </span><span style="color:#f5ab35">2</span><span>, </span><span style="color:#f5ab35">3</span><span>, </span><span style="color:#f5ab35">4</span><span>];
</span></code>
  • Object (Nesne):
<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> kisi: { </span><span class="hljs-attr">ad</span><span>: string, </span><span class="hljs-attr">yas</span><span>: number } = { </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Ahmet"</span><span>, </span><span class="hljs-attr">yas</span><span>: </span><span style="color:#f5ab35">30</span><span> };
</span></code>
  • Function (Fonksiyon):
<code class="language-javascript" style="white-space:pre"><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">topla</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">a: number, b: number</span><span class="hljs-function">): </span><span class="hljs-function" style="color:#00e0e0">number</span><span class="hljs-function"> </span><span>{
</span><span>    </span><span style="color:#dcc6e0">return</span><span> a + b;
</span></code>
  • Tuple (Demet):
<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> kullanici: [string, number] = [</span><span style="color:#abe338">"Ali"</span><span>, </span><span style="color:#f5ab35">25</span><span>];</span></code>

5. “any”, “unknown” ve “never” tipleri arasındaki farklar nelerdir?

any:

  • Herhangi bir türü temsil eder.
  • Tür kontrolü yapılmaz, dolayısıyla TypeScript'in tip güvenliği avantajı devre dışı kalır.
  • Eski JavaScript alışkanlıklarıyla uyumlu çalışmak için kullanılır, ancak dikkatli olunmalıdır.

unknown:

  • Türü bilinmeyen bir değişkeni temsil eder.
  • any'ye göre daha güvenlidir; çünkü işlem yapmadan önce tür kontrolü yapılması gerekir.
  • Özellikle dışarıdan gelen verilerde tercih edilir.

never:

  • Hiçbir değere sahip olmayacak fonksiyonlar için kullanılır.
  • Örneğin, sürekli hata fırlatan veya sonsuz döngüde kalan fonksiyonlarda kullanılır.
  • Fonksiyonun hiçbir zaman başarıyla sonlanmayacağını ifade eder.

Örnekler:

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> x: any = </span><span style="color:#abe338">"Merhaba"</span><span>;
</span><span>x = </span><span style="color:#f5ab35">42</span><span>;  </span><span style="color:#d4d0ab">// Hata vermez</span><span>
</span>
<span></span><span style="color:#dcc6e0">let</span><span> y: unknown = </span><span style="color:#abe338">"Merhaba"</span><span>;
</span><span></span><span style="color:#d4d0ab">// console.log(y.length); </span><span>
</span>
<span></span><span style="color:#d4d0ab">// HATA: unknown türü üzerinde işlem yapmadan önce kontrol edilmelidir.</span><span>
</span>
<span></span><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">hataF</span><span class="hljs-function">ı</span><span class="hljs-function" style="color:#00e0e0">rlat</span><span class="hljs-function">(</span><span class="hljs-function">): </span><span class="hljs-function" style="color:#00e0e0">never</span><span class="hljs-function"> </span><span>{
</span><span>    </span><span style="color:#dcc6e0">throw</span><span> </span><span style="color:#dcc6e0">new</span><span> </span><span style="color:#f5ab35">Error</span><span>(</span><span style="color:#abe338">"Bu fonksiyon asla geri dönmez!"</span><span>);
</span>}
</code>

6. Interface ve Type arasındaki farklar nelerdir?

Kullanım Alanı:

  • Interface: Özellikle nesneler ve sınıflar için tasarlanmıştır.Nesne yapılarının tanımlanmasında yaygın olarak tercih edilir.
  • Özellikle nesneler ve sınıflar için tasarlanmıştır.
  • Nesne yapılarının tanımlanmasında yaygın olarak tercih edilir.
  • Type: Daha esnek bir yapıya sahiptir.Fonksiyon tanımlamaları, birleşik (union) ve kesişim (intersection) türler gibi daha farklı kullanım senaryolarına uygundur.
  • Daha esnek bir yapıya sahiptir.
  • Fonksiyon tanımlamaları, birleşik (union) ve kesişim (intersection) türler gibi daha farklı kullanım senaryolarına uygundur.

Genişletilebilirlik:

  • Interface: extends anahtar kelimesi ile genişletilebilir.Birden fazla interface birleştirilebilir.
  • extends anahtar kelimesi ile genişletilebilir.
  • Birden fazla interface birleştirilebilir.
  • Type: & (kesişim operatörü) kullanılarak birden fazla tür birleştirilebilir.
  • & (kesişim operatörü) kullanılarak birden fazla tür birleştirilebilir.

Performans:

  • Interface: Derleme aşamasında daha performanslıdır.TypeScript tarafından daha verimli işlenir.
  • Derleme aşamasında daha performanslıdır.
  • TypeScript tarafından daha verimli işlenir.
  • Type: Genellikle daha az performanslıdır, karmaşık tanımlar performansı etkileyebilir.
  • Genellikle daha az performanslıdır, karmaşık tanımlar performansı etkileyebilir.

Örnek Kullanım:

<code class="language-javascript" style="white-space:pre"><span>interface Kisi {
</span><span>    </span><span class="hljs-attr">ad</span><span>: string;
</span>    yas: number;
<!-- -->}
<!-- -->
<!-- -->type Araba = {
<span>    </span><span class="hljs-attr">marka</span><span>: string;
</span>    model: string;
<!-- -->};
</code>

7. Enum (Enumerations) nedir ve nasıl kullanılır?

Enum, sabit değerleri temsil etmek için kullanılır.

<code class="language-javascript" style="white-space:pre"><span>enum Renk {
</span><span>    Kirmizi = </span><span style="color:#abe338">"KIRMIZI"</span><span>,
</span><span>    Mavi = </span><span style="color:#abe338">"MAVI"</span><span>,
</span><span>    Yesil = </span><span style="color:#abe338">"YESIL"</span><span>
</span>}
<!-- -->
<span></span><span style="color:#dcc6e0">let</span><span> benimRenk: Renk = Renk.Kirmizi;
</span><span></span><span style="color:#f5ab35">console</span><span>.log(benimRenk); </span><span style="color:#d4d0ab">// KIRMIZI</span><span>
</span></code>

8. Tuple (Demet) nedir ve nasıl kullanılır?

Tuple, sabit uzunlukta ve belirli türlerde değerler içeren bir dizidir.

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> kullanici: [string, number] = [</span><span style="color:#abe338">"Ahmet"</span><span>, </span><span style="color:#f5ab35">30</span><span>];
</span></code>

9. Type Assertion (Tip Dönüştürme) nedir ve nasıl kullanılır?

TypeScript’te, bir değişkenin türünü belirttiğiniz şekilde yorumlamasını sağlamak için kullanılır.

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> deger: any = </span><span style="color:#abe338">"Merhaba"</span><span>;
</span><span></span><span style="color:#dcc6e0">let</span><span> uzunluk: number = (deger </span><span style="color:#dcc6e0">as</span><span> string).length;
</span></code>

10. TypeScript dosyalarını tarayıcıda nasıl çalıştırabiliriz?

- TypeScript kodunu JavaScript’e derleyin:

<code class="language-javascript" style="white-space:pre"><span>tsc dosya.ts</span></code>

- Ortaya çıkan dosya.js dosyasını HTML içinde çağırın:

<code class="language-javascript" style="white-space:pre"><span><script src=</span><span style="color:#abe338">"dosya.js"</span><span>></script></span></code>

11. readonly ve const farkları nelerdir?

Hem readonly hem de const, değişkenlerin değiştirilemez olmasını sağlar, ancak kullanım alanları farklıdır.

Kullanım Yeri:

  • readonly: Sınıflar veya nesnelerdeki özellikleri (property) sabitlemek için kullanılır.
  • Sınıflar veya nesnelerdeki özellikleri (property) sabitlemek için kullanılır.
  • const: Değişken tanımlamalarında kullanılır, değer ataması sadece bir kez yapılabilir.
  • Değişken tanımlamalarında kullanılır, değer ataması sadece bir kez yapılabilir.

Zamanlama (Atama Anı):

  • readonly: Değer ataması yalnızca nesne oluşturulurken yapılabilir.
  • Değer ataması yalnızca nesne oluşturulurken yapılabilir.
  • const: Değer ataması yalnızca tanımlandığı anda yapılabilir, sonradan değiştirilemez.
  • Değer ataması yalnızca tanımlandığı anda yapılabilir, sonradan değiştirilemez.

Nesne İçeriği Üzerindeki Etkisi:

  • readonly: Sadece ilgili özelliğin (property) değiştirilmesini engeller.Ancak nesnenin diğer içeriği veya referansları değiştirilebilir.
  • Sadece ilgili özelliğin (property) değiştirilmesini engeller.
  • Ancak nesnenin diğer içeriği veya referansları değiştirilebilir.
  • const: Primitive türlerde (sayı, metin, boolean) tamamen sabittir.Referans türlerde (nesne, dizi) ise referans değiştirilemez ama içeriği değiştirilebilir.
  • Primitive türlerde (sayı, metin, boolean) tamamen sabittir.
  • Referans türlerde (nesne, dizi) ise referans değiştirilemez ama içeriği değiştirilebilir.

Örnekler:

<code class="language-javascript" style="white-space:pre"><span style="color:#d4d0ab">// readonly kullanımı</span><span>
</span><span></span><span class="hljs-class" style="color:#dcc6e0">class</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">Kisi</span><span class="hljs-class"> </span><span>{
</span>    readonly ad: string;
<span>    </span><span class="hljs-function" style="color:#00e0e0">constructor</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">ad: string</span><span class="hljs-function">)</span><span> {
</span><span>        </span><span style="color:#f5ab35">this</span><span>.ad = ad;
</span>    }
<!-- -->}
<!-- -->
<span></span><span style="color:#dcc6e0">const</span><span> kisi = </span><span style="color:#dcc6e0">new</span><span> Kisi(</span><span style="color:#abe338">"Ahmet"</span><span>);
</span><span></span><span style="color:#d4d0ab">// kisi.ad = "Mehmet"; // </span><span>
</span>
<span>HATA: readonly olduğu iç</span><span style="color:#dcc6e0">in</span><span> değiştirilemez
</span>
<span></span><span style="color:#d4d0ab">// const kullanımı</span><span>
</span><span></span><span style="color:#dcc6e0">const</span><span> yas = </span><span style="color:#f5ab35">30</span><span>;
</span><span></span><span style="color:#d4d0ab">// yas = 40; // </span><span>
</span>
<span>HATA: </span><span style="color:#dcc6e0">const</span><span> ile tanımlanan değişken değiştirilemez
</span>
<span></span><span style="color:#dcc6e0">const</span><span> araba = { </span><span class="hljs-attr">marka</span><span>: </span><span style="color:#abe338">"Toyota"</span><span> };
</span><span>araba.marka = </span><span style="color:#abe338">"BMW"</span><span>; </span><span style="color:#d4d0ab">// </span><span>
</span>
<span>Geçerli! (</span><span style="color:#dcc6e0">const</span><span> nesneyi değil, referansı korur)
</span></code>

12. Generics (Jenerikler) nedir ve nasıl kullanılır?

Generics, birden fazla veri türü ile çalışabilen kodlar yazmamızı sağlar. Fonksiyonlar, sınıflar ve arayüzler için kullanılabilir.

Generics ile Fonksiyon Kullanımı:

<code class="language-javascript" style="white-space:pre"><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">ekle</span><span class="hljs-function"><</span><span class="hljs-function" style="color:#00e0e0">T</span><span class="hljs-function">>(</span><span class="hljs-function" style="color:#f5ab35">deger: T</span><span class="hljs-function">): </span><span class="hljs-function" style="color:#00e0e0">T</span><span class="hljs-function"> </span><span>{
</span><span>    </span><span style="color:#dcc6e0">return</span><span> deger;
</span>}
<span></span><span style="color:#f5ab35">console</span><span>.log(ekle<string>(</span><span style="color:#abe338">"Merhaba"</span><span>)); </span><span style="color:#d4d0ab">// "Merhaba"</span><span>
</span><span></span><span style="color:#f5ab35">console</span><span>.log(ekle<number>(</span><span style="color:#f5ab35">42</span><span>)); </span><span style="color:#d4d0ab">// 42</span><span>
</span></code>

Generics ile Sınıf Kullanımı:

<code class="language-javascript" style="white-space:pre"><span class="hljs-class" style="color:#dcc6e0">class</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">Depo</span><span class="hljs-class"><</span><span class="hljs-class" style="color:#00e0e0">T</span><span class="hljs-class">> </span><span>{
</span>    private veriler: T[] = [];
<span>    </span><span class="hljs-function" style="color:#00e0e0">ekle</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">item: T</span><span class="hljs-function">)</span><span> {
</span><span>        </span><span style="color:#f5ab35">this</span><span>.veriler.push(item);
</span>    }
<!-- -->    getir(): T[] {
<span>        </span><span style="color:#dcc6e0">return</span><span> </span><span style="color:#f5ab35">this</span><span>.veriler;    }}
</span><span></span><span style="color:#dcc6e0">const</span><span> stringDepo = </span><span style="color:#dcc6e0">new</span><span> Depo<string>();
</span><span>stringDepo.ekle(</span><span style="color:#abe338">"TypeScript"</span><span>);
</span><span></span><span style="color:#f5ab35">console</span><span>.log(stringDepo.getir()); </span><span style="color:#d4d0ab">// ["TypeScript"]</span><span>
</span></code>

13. Union ve Intersection tipleri nedir?

Union Type (| operatörü):

Bir değişkenin birden fazla türden birini almasını sağlar.

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> veri: string | number;
</span><span>veri = </span><span style="color:#abe338">"Merhaba"</span><span>; </span><span style="color:#d4d0ab">// Geçerli</span><span>
</span><span>veri = </span><span style="color:#f5ab35">42</span><span>; </span><span style="color:#d4d0ab">// Geçerli</span><span>
</span><span></span><span style="color:#d4d0ab">// veri = true; // HATA!</span><span>
</span></code>

Intersection Type (& operatörü):

Birden fazla türü birleştirerek yeni bir tür oluşturur.

<code class="language-javascript" style="white-space:pre"><span>interface Kisi {
</span><span>    </span><span class="hljs-attr">ad</span><span>: string;
</span>    yas: number;
<!-- -->}
<!-- -->interface Calisan {
<span>    </span><span class="hljs-attr">sirket</span><span>: string;
</span>}
<!-- -->type CalisanKisi = Kisi & Calisan;
<!-- -->
<span></span><span style="color:#dcc6e0">const</span><span> kisi: CalisanKisi = {
</span><span>    </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Ahmet"</span><span>,
</span><span>    </span><span class="hljs-attr">yas</span><span>: </span><span style="color:#f5ab35">30</span><span>,
</span><span>    </span><span class="hljs-attr">sirket</span><span>: </span><span style="color:#abe338">"ABC Ltd."</span><span>
</span>};
</code>

14. TypeScript’te bir nesneyi zorunlu veya opsiyonel hale getirmek için hangi tip yardımcılarını kullanabiliriz?

Opsiyonel (? operatörü):

<code class="language-javascript" style="white-space:pre"><span>interface Kullanici {
</span><span>    </span><span class="hljs-attr">ad</span><span>: string;
</span><span>    yas?: number; </span><span style="color:#d4d0ab">// Opsiyonel</span><span>
</span>}
</code>

Partial<T> – Tüm özellikleri opsiyonel yapar:

<code class="language-javascript" style="white-space:pre"><span>interface Kullanici {
</span><span>    </span><span class="hljs-attr">ad</span><span>: string;
</span>    yas: number;
<!-- -->}
<span></span><span style="color:#dcc6e0">let</span><span> k1: Partial<Kullanici> = { </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Ahmet"</span><span> }; </span><span style="color:#d4d0ab">// yas eksik olabilir</span><span>
</span></code>

Required<T> – Tüm özellikleri zorunlu yapar:

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">let</span><span> k2: Required<Kullanici> = { </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Mehmet"</span><span>, </span><span class="hljs-attr">yas</span><span>: </span><span style="color:#f5ab35">25</span><span> }; </span><span style="color:#d4d0ab">// Tüm özellikler zorunlu</span></code>

15. TypeScript’te Overload (Aşırı Yükleme) nedir ve nasıl çalışır?

Overload, aynı fonksiyonun farklı parametre türleriyle çalışmasını sağlar.

Örnek Kullanım:

<code class="language-javascript" style="white-space:pre"><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">topla</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">a: number, b: number</span><span class="hljs-function">): </span><span class="hljs-function" style="color:#00e0e0">number</span><span>;
</span><span></span><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">topla</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">a: string, b: string</span><span class="hljs-function">): </span><span class="hljs-function" style="color:#00e0e0">string</span><span>;
</span><span></span><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">topla</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">a: any, b: any</span><span class="hljs-function">): </span><span class="hljs-function" style="color:#00e0e0">any</span><span class="hljs-function"> </span><span>{
</span><span>    </span><span style="color:#dcc6e0">return</span><span> a + b;
</span>}
<span></span><span style="color:#f5ab35">console</span><span>.log(topla(</span><span style="color:#f5ab35">5</span><span>, </span><span style="color:#f5ab35">10</span><span>)); </span><span style="color:#d4d0ab">// 15</span><span>
</span><span></span><span style="color:#f5ab35">console</span><span>.log(topla(</span><span style="color:#abe338">"Merhaba"</span><span>, </span><span style="color:#abe338">" Dünya"</span><span>)); </span><span style="color:#d4d0ab">// "Merhaba Dünya"</span><span>
</span></code>

Overload olmadan topla fonksiyonu sadece any olarak tanımlanabilir ve tür güvenliği sağlanamaz.

16. Abstract Class ile Interface farkları nelerdir?

Tanım:

  • Abstract Class: Hem metot imzaları hem de uygulanmış (içeriği olan) metotlar içerebilir.Ortak davranışları ve temel yapıyı barındırmak için kullanılır.
  • Hem metot imzaları hem de uygulanmış (içeriği olan) metotlar içerebilir.
  • Ortak davranışları ve temel yapıyı barındırmak için kullanılır.
  • Interface: Sadece metot imzalarını tanımlar.Uygulama detayları içermez, tamamen soyuttur.
  • Sadece metot imzalarını tanımlar.
  • Uygulama detayları içermez, tamamen soyuttur.

Miras (Inheritance):

  • Abstract Class: extends anahtar kelimesi ile miras alınır.Alt sınıf, abstract metotları uygulamak zorundadır.
  • extends anahtar kelimesi ile miras alınır.
  • Alt sınıf, abstract metotları uygulamak zorundadır.
  • Interface: implements anahtar kelimesi ile uygulanır.Sınıf, interface’te tanımlı tüm metotları gerçekleştirmek zorundadır.
  • implements anahtar kelimesi ile uygulanır.
  • Sınıf, interface’te tanımlı tüm metotları gerçekleştirmek zorundadır.

Çoklu Kalıtım (Multiple Inheritance):

  • Abstract Class: Sadece tek bir abstract class miras alınabilir.
  • Sadece tek bir abstract class miras alınabilir.
  • Interface: Birden fazla interface aynı anda uygulanabilir, çoklu kalıtım desteklenir.
  • Birden fazla interface aynı anda uygulanabilir, çoklu kalıtım desteklenir.

Örnek Kullanım:

<code class="language-javascript" style="white-space:pre"><span>abstract </span><span class="hljs-class" style="color:#dcc6e0">class</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">Hayvan</span><span class="hljs-class"> </span><span>{
</span><span>    abstract sesCikar(): </span><span style="color:#dcc6e0">void</span><span>;
</span><span>    hareket(): </span><span style="color:#dcc6e0">void</span><span> {
</span><span>        </span><span style="color:#f5ab35">console</span><span>.log(</span><span style="color:#abe338">"Hareket ediyor"</span><span>);
</span>    }
<!-- -->}
</code>

Diğer Örnek:

<code class="language-javascript" style="white-space:pre"><span>interface Ucak {
</span><span>    uc(): </span><span style="color:#dcc6e0">void</span><span>;
</span>}
<!-- -->
<span></span><span class="hljs-class" style="color:#dcc6e0">class</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">Boeing</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">implements</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">Ucak</span><span class="hljs-class"> </span><span>{
</span><span>    </span><span class="hljs-function" style="color:#00e0e0">uc</span><span class="hljs-function">(</span><span class="hljs-function">)</span><span> {
</span><span>        </span><span style="color:#f5ab35">console</span><span>.log(</span><span style="color:#abe338">"Uçuyor"</span><span>);
</span>    }
<!-- -->}
</code>

17. Mapped Types (Haritalı Tipler) nedir?

Mapped Types, mevcut bir tipi değiştirerek yeni bir tip oluşturmayı sağlar.

Örnek Kullanım:

<code class="language-javascript" style="white-space:pre"><span>type Ornek = {
</span><span>    </span><span class="hljs-attr">ad</span><span>: string;
</span>    yas: number;
<!-- -->};
<!-- -->
<!-- -->type ReadonlyOrnek = {
<span>    [K </span><span style="color:#dcc6e0">in</span><span> keyof Ornek]: Readonly<Ornek[K]>;
</span>};
<!-- -->
<span></span><span style="color:#d4d0ab">// ReadonlyOrnek içinde tüm özellikler readonly olur.</span><span>
</span></code>

18. Utility Types (Özel Tip Yardımcıları) nelerdir?

TypeScript, mevcut türleri daha verimli kullanabilmemiz için bazı yardımcı tipler sunar.

Partial<T>:

  • Verilen T türündeki tüm özellikleri opsiyonel hale getirir.
  • Özellikle form yapıları ve adım adım veri işleme gibi senaryolarda kullanışlıdır.

Required<T>:

  • Verilen T türündeki tüm özellikleri zorunlu yapar.
  • Opsiyonel olarak tanımlanmış alanları da zorunlu hale getirerek daha katı bir yapı oluşturur.

Readonly<T>:

  • T türündeki tüm özellikleri readonly yapar.
  • Bu sayede özelliklerin sonradan değiştirilmesi engellenir.

Pick<T, K>:

  • T türünden, K ile belirtilen özellikleri seçerek yeni bir tür oluşturur.
  • Sadece ihtiyaç duyulan alanların kullanılması gereken durumlarda idealdir.

Omit<T, K>:

  • T türünden, K ile belirtilen özellikleri hariç tutarak yeni bir tür oluşturur.
  • Bazı alanları dışarıda bırakarak sadeleştirilmiş tür tanımları yapılabilir.

Örnekler:

<code class="language-javascript" style="white-space:pre"><span>interface Kisi {
</span><span>    </span><span class="hljs-attr">ad</span><span>: string;
</span>    yas: number;
<!-- -->    email: string;
<!-- -->}
<!-- -->
<span></span><span style="color:#d4d0ab">// Partial - Tüm özellikleri opsiyonel yapar</span><span>
</span><span></span><span style="color:#dcc6e0">let</span><span> kisi1: Partial<Kisi> = { </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Ahmet"</span><span> };
</span>
<span></span><span style="color:#d4d0ab">// Required - Tüm özellikleri zorunlu yapar</span><span>
</span><span></span><span style="color:#dcc6e0">let</span><span> kisi2: Required<Kisi> = { </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Ahmet"</span><span>, </span><span class="hljs-attr">yas</span><span>: </span><span style="color:#f5ab35">30</span><span>, </span><span class="hljs-attr">email</span><span>: </span><span style="color:#abe338">"a@example.com"</span><span> };
</span>
<span></span><span style="color:#d4d0ab">// Readonly - Özellikleri değiştirilemez yapar</span><span>
</span><span></span><span style="color:#dcc6e0">let</span><span> kisi3: Readonly<Kisi> = { </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Ahmet"</span><span>, </span><span class="hljs-attr">yas</span><span>: </span><span style="color:#f5ab35">30</span><span>, </span><span class="hljs-attr">email</span><span>: </span><span style="color:#abe338">"a@example.com"</span><span> };
</span><span></span><span style="color:#d4d0ab">// kisi3.yas = 35; // HATA!</span><span>
</span>
<span></span><span style="color:#d4d0ab">// Pick - Sadece belirli özellikleri alır</span><span>
</span><span></span><span style="color:#dcc6e0">let</span><span> kisi4: Pick<Kisi, </span><span style="color:#abe338">"ad"</span><span> | </span><span style="color:#abe338">"email"</span><span>> = { </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Ahmet"</span><span>, </span><span class="hljs-attr">email</span><span>: </span><span style="color:#abe338">"a@example.com"</span><span> };
</span>
<span></span><span style="color:#d4d0ab">// Omit - Belirtilen özellikleri hariç tutar</span><span>
</span><span></span><span style="color:#dcc6e0">let</span><span> kisi5: Omit<Kisi, </span><span style="color:#abe338">"email"</span><span>> = { </span><span class="hljs-attr">ad</span><span>: </span><span style="color:#abe338">"Ahmet"</span><span>, </span><span class="hljs-attr">yas</span><span>: </span><span style="color:#f5ab35">30</span><span> };
</span></code>

19. TypeScript ile Bir React veya Node.js Projesi Nasıl Oluşturulur?

A) React ile TypeScript Projesi Oluşturma

TypeScript destekli bir React projesi oluşturmak için aşağıdaki adımları takip edebilirsiniz.

1. Yeni Proje Oluşturma

<code class="language-javascript" style="white-space:pre"><span>npx create-react-app my-app --template typescript</span></code>

Bu komut, TypeScript ile ön yapılandırılmış bir React projesi başlatır.

2. TypeScript Tiplerini Yükleme

React projelerinde TypeScript'in sağlıklı çalışması için bazı tip paketlerini yüklemek gerekir:

<code class="language-javascript" style="white-space:pre"><span>npm install @types/react @types/react-dom</span></code>

3. TypeScript Dosyaları Kullanımı

React bileşenleri artık .tsx uzantısını kullanarak oluşturulur.

Fonksiyonel Bir React Bileşeni
<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">import</span><span> React </span><span style="color:#dcc6e0">from</span><span> </span><span style="color:#abe338">"react"</span><span>;
</span>interface Props {
<span>  </span><span class="hljs-attr">ad</span><span>: string;
</span>  yas?: number;
<!-- -->}
<span></span><span style="color:#dcc6e0">const</span><span> Merhaba: React.FC<Props> = </span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">{ ad, yas }</span><span class="hljs-function">) =></span><span> {
</span><span> </span><span style="color:#dcc6e0">return</span><span> </span><span class="xml" style="color:#ffa07a"><</span><span class="xml" style="color:#ffa07a">h1</span><span class="xml" style="color:#ffa07a">></span><span class="xml">Merhaba, {ad}! {yas && `Yaşın: ${yas}`}</span><span class="xml" style="color:#ffa07a"></</span><span class="xml" style="color:#ffa07a">h1</span><span class="xml" style="color:#ffa07a">></span><span>;
</span>};
<span></span><span style="color:#dcc6e0">export</span><span> </span><span style="color:#dcc6e0">default</span><span> Merhaba;
</span></code>

4. Projeyi Çalıştırma

<code class="language-javascript" style="white-space:pre"><span>npm start</span></code>

React projeniz artık TypeScript desteğiyle çalışıyor!

B) Node.js ile TypeScript Projesi Oluşturma

Node.js'de TypeScript kullanarak backend uygulamaları geliştirmek için şu adımları izleyebilirsiniz.

1. Yeni Proje Oluşturma

<code class="language-javascript" style="white-space:pre"><span>mkdir my-node-ts-app
</span>cd my-node-ts-app
<!-- -->npm init -y
</code>

2. TypeScript ve Gerekli Bağımlılıkları Yükleme

<code class="language-javascript" style="white-space:pre"><span>npm install typescript ts-node @types/node --save-dev</span></code>

3. TypeScript Konfigürasyonu (tsconfig.json)

Aşağıdaki komutla TypeScript yapılandırma dosyası oluşturabilirsiniz:

<code class="language-javascript" style="white-space:pre"><span>npx tsc --init</span></code>

Oluşan tsconfig.json dosyasında bazı temel ayarlar:

<code class="language-javascript" style="white-space:pre"><span>{
</span><span>  </span><span style="color:#abe338">"compilerOptions"</span><span>: {
</span><span>    </span><span style="color:#abe338">"target"</span><span>: </span><span style="color:#abe338">"ES6"</span><span>,
</span><span>    </span><span style="color:#abe338">"module"</span><span>: </span><span style="color:#abe338">"CommonJS"</span><span>,
</span><span>    </span><span style="color:#abe338">"outDir"</span><span>: </span><span style="color:#abe338">"./dist"</span><span>,
</span><span>    </span><span style="color:#abe338">"rootDir"</span><span>: </span><span style="color:#abe338">"./src"</span><span>,
</span><span>    </span><span style="color:#abe338">"strict"</span><span>: </span><span style="color:#f5ab35">true</span><span>
</span>  }
<!-- -->}
</code>

4. TypeScript ile Basit Bir Node.js Sunucusu

Bir src/index.ts dosyası oluşturup içine aşağıdaki kodu yazabilirsiniz:

<code class="language-javascript" style="white-space:pre"><span style="color:#dcc6e0">import</span><span> http </span><span style="color:#dcc6e0">from</span><span> </span><span style="color:#abe338">"http"</span><span>;
</span><span></span><span style="color:#dcc6e0">const</span><span> server = http.createServer(</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">req, res</span><span class="hljs-function">) =></span><span> {
</span><span>  res.writeHead(</span><span style="color:#f5ab35">200</span><span>, { </span><span style="color:#abe338">"Content-Type"</span><span>: </span><span style="color:#abe338">"text/plain"</span><span> });
</span><span>  res.end(</span><span style="color:#abe338">"Merhaba, TypeScript ile Node.js!"</span><span>);
</span>});
<span>server.listen(</span><span style="color:#f5ab35">3000</span><span>, </span><span class="hljs-function">() =></span><span> {
</span><span>  </span><span style="color:#f5ab35">console</span><span>.log(</span><span style="color:#abe338">"Sunucu 3000 portunda çalışıyor..."</span><span>);
</span>});
</code>

5. TypeScript Kodu Çalıştırma

Kodunuzu TypeScript ile çalıştırmak için:

<code class="language-javascript" style="white-space:pre"><span>npx ts-node src/index.ts</span></code>

6. JavaScript’e Çevirme ve Çalıştırma

Önce TypeScript kodunu JavaScript’e derleyin:

<code class="language-javascript" style="white-space:pre"><span>npx tsc</span></code>

Ardından oluşan JavaScript kodunu çalıştırın:

<code class="language-javascript" style="white-space:pre"><span>node dist/index.js</span></code>

Artık TypeScript destekli bir Node.js projesi oluşturmuş oldunuz!

20. TypeScript’te "Decorator" Nedir ve Hangi Durumlarda Kullanılır?

Decorator Nedir?

Decorator (Dekoratörler), bir sınıfa veya sınıfın metodlarına, özelliklerine ve parametrelerine özel işlevler eklemek için kullanılır. TypeScript’te @decoratorName şeklinde tanımlanır ve metadata, logging, validasyon gibi işlemler için kullanılır.

Decorator Kullanımı İçin Ayarlar

Dekoratörleri kullanabilmek için tsconfig.json dosyanızda şu ayarı açmanız gerekir:

<code class="language-javascript" style="white-space:pre"><span>{
</span><span>  </span><span style="color:#abe338">"compilerOptions"</span><span>: {
</span><span>    </span><span style="color:#abe338">"experimentalDecorators"</span><span>: </span><span style="color:#f5ab35">true</span><span>
</span>  }
<!-- -->}
</code>

TypeScript’te Farklı Decorator Kullanım Alanları

TypeScript’te 4 temel decorator türü vardır:

  1. Class Decorator (Sınıf Dekoratörü)
  2. Method Decorator (Metot Dekoratörü)
  3. Property Decorator (Özellik Dekoratörü)
  4. Parameter Decorator (Parametre Dekoratörü)

1) Class Decorator (Sınıf Dekoratörü)

Bir sınıfa özel özellikler eklemek için kullanılır.

<code class="language-javascript" style="white-space:pre"><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">LogSinifi</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">target: </span><span class="hljs-function" style="color:#f5ab35">Function</span><span class="hljs-function">) </span><span>{
</span><span>    </span><span style="color:#f5ab35">console</span><span>.log(</span><span style="color:#abe338">`Sınıf oluşturuldu: </span><span class="hljs-subst" style="color:#abe338">${target.name}</span><span style="color:#abe338">`</span><span>);
</span>}
<!-- -->@LogSinifi
<span></span><span class="hljs-class" style="color:#dcc6e0">class</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">Araba</span><span class="hljs-class"> </span><span>{
</span><span>    </span><span class="hljs-function" style="color:#00e0e0">constructor</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">public marka: string</span><span class="hljs-function">)</span><span> {}
</span>}
</code>

Çıktı:

<code class="language-javascript" style="white-space:pre"><span>Sınıf oluşturuldu: Araba</span></code>

Ne işe yarar?

  • Logging (Loglama)
  • Singleton pattern uygulamak
  • Sınıf özelliklerini değiştirmek

2) Method Decorator (Metot Dekoratörü)

Bir metot çağrıldığında belirli işlemleri gerçekleştirmek için kullanılır.

<code class="language-javascript" style="white-space:pre"><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">LogMetot</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">target: any, key: string, descriptor: PropertyDescriptor</span><span class="hljs-function">) </span><span>{
</span><span>    </span><span style="color:#dcc6e0">const</span><span> orijinalMetot = descriptor.value;
</span><span>   descriptor.value = </span><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> (</span><span class="hljs-function" style="color:#f5ab35">...args: any[]</span><span class="hljs-function">) </span><span>{
</span><span>        </span><span style="color:#f5ab35">console</span><span>.log(</span><span style="color:#abe338">`Metot çağrıldı: </span><span class="hljs-subst" style="color:#abe338">${key}</span><span style="color:#abe338">, Parametreler: </span><span class="hljs-subst" style="color:#abe338">${args}</span><span style="color:#abe338">`</span><span>);
</span><span>        </span><span style="color:#dcc6e0">return</span><span> orijinalMetot.apply(</span><span style="color:#f5ab35">this</span><span>, args);
</span>    };
<!-- -->}
<span></span><span class="hljs-class" style="color:#dcc6e0">class</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">HesapMakinesi</span><span class="hljs-class"> </span><span>{
</span>    @LogMetot
<span>    </span><span class="hljs-function" style="color:#00e0e0">topla</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">a: number, b: number</span><span class="hljs-function">)</span><span> {
</span><span>        </span><span style="color:#dcc6e0">return</span><span> a + b;
</span>    }
<!-- -->}
<span></span><span style="color:#dcc6e0">const</span><span> hesap = </span><span style="color:#dcc6e0">new</span><span> HesapMakinesi();
</span><span></span><span style="color:#f5ab35">console</span><span>.log(hesap.topla(</span><span style="color:#f5ab35">5</span><span>, </span><span style="color:#f5ab35">3</span><span>));
</span></code>

‍Çıktı:

<code class="language-javascript" style="white-space:pre"><span>Metot çağrıldı: topla, </span><span class="hljs-attr">Parametreler</span><span>: </span><span style="color:#f5ab35">5</span><span>,</span><span style="color:#f5ab35">3</span><span>
</span><span></span><span style="color:#f5ab35">8</span><span>
</span></code>

Ne işe yarar?

  • Logging
  • Cacheleme (Caching)
  • Yetkilendirme (Authorization)

3) Property Decorator (Özellik Dekoratörü)

Bir sınıfın özelliklerine özel işlemler eklemek için kullanılır.

<code class="language-javascript" style="white-space:pre"><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">ReadOnly</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">target: any, key: string</span><span class="hljs-function">) </span><span>{
</span><span>    </span><span style="color:#f5ab35">Object</span><span>.defineProperty(target, key, {
</span><span>        </span><span class="hljs-attr">writable</span><span>: </span><span style="color:#f5ab35">false</span><span>
</span>    });
<!-- -->}
<span></span><span class="hljs-class" style="color:#dcc6e0">class</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">Kullanici</span><span class="hljs-class"> </span><span>{
</span>    @ReadOnly
<span>    public email: string = </span><span style="color:#abe338">"ornek@email.com"</span><span>;
</span>}
<span></span><span style="color:#dcc6e0">const</span><span> k = </span><span style="color:#dcc6e0">new</span><span> Kullanici();
</span><span></span><span style="color:#d4d0ab">// k.email = "yeni@email.com"; // HATA! (ReadOnly olduğu için değiştirilemez)</span><span>
</span></code>

Ne işe yarar?

  • Özelliklerin değiştirilemez olmasını sağlamak
  • Veri doğrulama (validation) işlemleri yapmak

4) Parameter Decorator (Parametre Dekoratörü)

Bir metodun parametresine dekoratör ekleyerek işlem yapmak için kullanılır.

<code class="language-javascript" style="white-space:pre"><span class="hljs-function" style="color:#dcc6e0">function</span><span class="hljs-function"> </span><span class="hljs-function" style="color:#00e0e0">LogParametre</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">target: any, key: string, index: number</span><span class="hljs-function">) </span><span>{
</span><span>    </span><span style="color:#f5ab35">console</span><span>.log(</span><span style="color:#abe338">`Metot: </span><span class="hljs-subst" style="color:#abe338">${key}</span><span style="color:#abe338">, Parametre İndeksi: </span><span class="hljs-subst" style="color:#abe338">${index}</span><span style="color:#abe338">`</span><span>);
</span>}
<span></span><span class="hljs-class" style="color:#dcc6e0">class</span><span class="hljs-class"> </span><span class="hljs-class" style="color:#00e0e0">API</span><span class="hljs-class"> </span><span>{
</span><span>    </span><span class="hljs-function" style="color:#00e0e0">getUser</span><span class="hljs-function">(</span><span class="hljs-function" style="color:#f5ab35">@LogParametre id: number</span><span class="hljs-function">)</span><span> {
</span><span>        </span><span style="color:#f5ab35">console</span><span>.log(</span><span style="color:#abe338">`Kullanıcı ID: </span><span class="hljs-subst" style="color:#abe338">${id}</span><span style="color:#abe338">`</span><span>);
</span>    }
<!-- -->}
<span></span><span style="color:#dcc6e0">const</span><span> api = </span><span style="color:#dcc6e0">new</span><span> API();
</span><span>api.getUser(</span><span style="color:#f5ab35">123</span><span>);
</span></code>

Çıktı:

<code class="language-javascript" style="white-space:pre"><span>Metot: getUser, Parametre İndeksi: </span><span style="color:#f5ab35">0</span><span>
</span><span>Kullanıcı ID: </span><span style="color:#f5ab35">123</span><span>
</span></code>

Ne işe yarar?

  • API doğrulama işlemleri
  • Güvenlik kontrolleri

TypeScript, modern yazılım geliştirme dünyasında hata oranlarını minimize eden, ölçeklenebilir ve güvenli kod yazılmasını sağlayan güçlü bir araçtır. React ve Node.js gibi teknolojilerle uyumlu çalışması, büyük çaplı projelerde hız ve verimlilik sağlaması, onu günümüz yazılım geliştirme trendlerinde vazgeçilmez bir dil haline getirmiştir.

Bu yazıda paylaştığımız TypeScript mülakat soruları ve detaylı cevapları, yalnızca bir mülakatı geçmenize yardımcı olmakla kalmayacak, aynı zamanda TypeScript konusunda derinlemesine bilgi sahibi olmanızı sağlayacaktır. Eğer TypeScript öğrenmeye veya geliştirmeye devam etmek istiyorsanız, pratik yaparak ve gerçek dünya projelerinde kullanarak öğrendiklerinizi pekiştirebilirsiniz.

Bu yazıyı paylaş