ProgramlamaFullstack geliştirici

TypeScript'te iç içe parametrelerin yapısını belirleyip tipini nasıl uygulayabilirsiniz? Varsayılan değerler, isteğe bağlı ve zorunlu özellikler kullanırken nelere dikkat etmelisiniz?

Hintsage yapay zeka asistanı ile mülakatları geçin

Cevap.

Sorunun tarihi: JavaScript'te, işlevler genellikle imza içinde nesnelerin yapısını kullanarak parçalanır. TypeScript'te bu yaklaşım, parçalanacak parametrelerin yapısının kesin bir şekilde tanımlanmasını ve varsayılan değerlerin belirtilmesini gerektirir; aksi takdirde, mevcut olmayan özelliklere erişim sırasında hatalar ve yanlış tip çıkışları meydana gelebilir.

Problem: Parçalanan nesnedeki tüm parametrelerin veya belirli iç özelliklerin doğru tipini tanımlamanın ne kadar zor olduğudur, özellikle isteğe bağlı ve iç içe alanlar ile varsayılan değerler olduğunda.

Çözüm: Her zaman işlev parametrelerinin yapısı için ayrı bir tip veya arayüz tanımlayın, hangi alanların zorunlu, hangi alanların isteğe bağlı olduğunu açıkça belirtin ve varsayılan değerleri işlevin gövdesinde veya doğrudan parametrelerde ES6 söz dizimi kullanarak tanımlayın.

Kod örneği:

interface UserOptions { name: string; age?: number; address?: { city: string; zipcode?: string }; } function registerUser( { name, age = 18, address = { city: 'Unknown' } }: UserOptions ): string { return `${name}, ${age}, ${address.city}`; }

Anahtar özellikler:

  • İç içe parametrelerin parçalanmasında mutlaka arayüz veya tip kullanın.
  • Varsayılan değerleri işlevin imzasında tanımlayın.
  • İsteğe bağlı özellikler (age?, address?) için her zaman mevcut olmadığı senaryoları düşünün.

Sürpriz sorular.

Parametre nesnesinin tip tanımını atlayabilir miyim - otomatik çıkışa güvenerek?

Hayır, bu tehlikeli. UserOptions tipini belirtmezseniz, derleyici zorunlu özellikler hakkında bilgi vermeyecek, varsayılan değerler iç alanlar için etkilenmeyecek ve kullanma aşamasında örtük hatalar ortaya çıkacaktır.

function example({ x, y }) { ... } // x ve y - any

İç içe nesne için varsayılan bir değer nasıl verilir, kısmen özellikleri değiştirerek?

Spread kullanın. Ancak spread, eğer address tipi isteğe bağlıysa, tipleri "birleştirmez". Kontrol etmeniz ya da varsayılan değeri açıkça belirtmeniz gerekir.

function fn({ obj = { foo: 1 } }: { obj?: { foo: number } }) { const address = { foo: 42, ...obj }; }

Varsayılan değeri olmayan isteğe bağlı alanlarla parçalanmanın tehlikesi nedir?

Eğer isteğe bağlı alanlarda varsayılanı atlarsanız, özelliklere (örneğin, address.city) erişimler çalışma zamanı hatalarına neden olabilir. Daha iyi bir şekilde ? işaretini ve varsayılanı açıkça koymak.

function danger({ address }: { address?: { city: string } }) { console.log(address.city); // Hata, address undefined olabilir }

Tip hataları ve anti-patentler

  • Parçalanan argümanların örtük tiplemesi (any)
  • İç içe/isteğe bağlı özellikler için varsayılanın olmaması
  • Yapısal parametreler için arayüzler ve tip takma adlarının kullanılmaması

Hayattan bir örnek

Negatif durum

Eski kodda, parametre nesnesini belirgin tip vermeden parçalanıyordu. İşleve yeni bir alan eklenince, tüm kullanım yerleri otomatik olarak bulunamadı ve üretimde çağrılar kırıldı.

Artılar:

  • Hızlı ve kolay yazma

Eksiler:

  • Yapı üzerinde güvenlik ve kontrol eksikliği
  • Değişikliklerde kırılganlık

Pozitif durum

Bu tür tüm işlevler için arayüzler uyguladık, undefined ve varsayılan değerlerle senaryoları testlerle kapsadık, derleyici ipuçları toplu değişiklikler yapmamıza olanak tanıdı.

Artılar:

  • Yüksek tip güvenliği
  • Yeniden yapılandırma ve ölçeklemede kolaylık

Eksiler:

  • Tip bildirimlerinde biraz daha fazla metin