TypeScript Şablonu Dize Türleri

Şablon dizesi mekanizmasını kullanarak dize türleri nasıl daraltılır

Şablon Değişmez Türleri Nelerdir?

Typescript 4.1'den bu yana, dizeleriniz için yazımları önemli ölçüde geliştirebilirsiniz. Hızlı bir şekilde özetlemek gerekirse, Typescript'te “Hazır Tipler” olarak adlandırılan tanımlayabilirsiniz. Bir değişkeni yalnızca dize olarak tanımlamak yerine, türü izin verilen belirli bir dizi dizisine daraltabilirsiniz.

// Define a mutable string as 'Literal Type'.
let key: "name" | "department" = "name";

// This works, as 'department' is part of the type.
key = "department";
// Won't work, as it's not define in the union type.
key = "company";

// Of course, the same applies for functions.
function getKey(): "name" | "department" {
  return Math.random() <= 0.5 ? "name" : "department";
}

TypeScript 4.1 ile başlayarak, bu kavram daha da geliştirilmiştir. Javascript'ten “Template Literal Strings” i ilham alarak, Typescript'teki literal türleriniz için aynı sözdizimini uygulayabilirsiniz. Temel fark, "Şablon Değişmez Türleri" ile, türün kendisi bu şekil için parametreler alabildiğinden çok daha fazla esneklik kazanırsınız - kavram jeneriklere benzer, ancak belirli değerler gerektirdiği için biraz farklıdır.

// Define a Literal Type
type State = "ready";

// Nice, isn't it? As in Javascript's 
// 'template literal strings', we can
// reuse the same syntax for TS.
//
// The create type here is now 'Key-ready'.
type Key = `key-${State}`;
// This of course works for union types as well.
// Let's take these non-descriptive types for a 
// quick demo:
type GraphState = "sleep" | "ready" | "error";
type MachineState = "booting" | "running";

// And here's the 'template literal type':
type EntityState = `ES-${GraphState | MachineState}`;

// The possible combinations therefore 
// work out like this:
//
// type EntityState = 'ES-sleep' 
//  | 'ES-ready'
//  | 'ES-error'
//  | 'ES-booting'
//  | 'ES-running'

Typescript 4.3 ile daha da fazlası var

Bunu yazarken, TypeScript 4.3 için, Template Literal Types için daha fazla geliştirme içeren sürüm adayı yayınlandı.

Yazı sistemi şimdi daha da dinamik ve sizin için doğru türleri daha iyi çıkarabiliyor. Bu son değişiklikler Template String Type'ı daha da olgunlaştırıyor.

// This example is taken 1:1 from 
// Typescript's 4.3 announcement.
// Please check out the link in the
// addendum to see all examples!

declare let s: string;
declare function f<T extends string>(x: T): T;

// Previously: string
// Now       : `hello-${string}`
let x2 = f(`hello ${s}`);

Sonuç

Gördüğünüz gibi, konu dinamik türleri tanımlamaya geldiğinde Typescript çok güçlü bir dildir. Bu, özellikle dize tabanlı türler için geçerlidir. 4.3 sürümündeki en son değişikliklerle, yazım sistemi doğru türleri her zamankinden daha iyi çıkarabiliyor ve bu da Typescript ile çalışmayı sadece bir zevk haline getiriyor.

Öneriler

İlgili

Ek

Diller