TypeScript String: İnterpolasyon, Çok Satırlı Metin ve Contains

Bir TypeScript string'i, string tipine sahip bir JavaScript string'idir. İnterpolasyon için bir template literal yazın: ${expression} yer tutucuları içeren backtick'ler. Tek ve çift tırnaklar interpolasyonsuz düz string'ler oluşturur.

const author: string = "Ada";
const year = 1843;

// String interpolation with a template literal
const intro = `${author} published her notes in ${year}.`;
console.log(intro);

// Any expression works inside ${ }
const price = 19.5;
const qty = 3;
console.log(`Total: $${(price * qty).toFixed(2)}`); // Total: $58.50
console.log(`${qty > 1 ? "items" : "item"} in cart: ${qty}`);

Üç tırnak stili de aynı tipi, string tipini üretir. $${...} içindeki ilk $ düz bir dolar işaretidir; yer tutucuyu yalnızca ${ başlatır.

String İnterpolasyonu

${ } içine bir değişken, aritmetik, bir fonksiyon çağrısı, bir ternary ya da iç içe bir template literal koyabilirsiniz. Değer, String(value) nasıl dönüştürüyorsa aynı şekilde string'e dönüştürülür (istisna symbol: onu interpolasyona sokmak TS2731 derleme hatasıdır ve çalışma zamanında bir TypeError fırlatırdı; String(sym) yazın).

type User = { name: string; roles: string[]; lastLogin: Date | null };

const user: User = {
    name: "grace",
    roles: ["admin", "editor"],
    lastLogin: new Date("2024-03-15T10:30:00Z"),
};

const capitalize = (s: string) => s[0].toUpperCase() + s.slice(1);

console.log(`User: ${capitalize(user.name)}`);
console.log(`Roles: ${user.roles.join(", ")}`);
console.log(`Last login: ${user.lastLogin?.toISOString() ?? "never"}`);
console.log(`Raw array: ${user.roles}`); // arrays join with commas

Bir nesneyi interpolasyona sokmak [object Object] yazdırır; bu neredeyse hiçbir zaman istediğiniz şey değildir. Alanları seçin ya da JSON.stringify(obj) kullanın.

Çok Satırlı String'ler

Bir template literal birden fazla satıra yayılabilir. Satır sonları korunur, her satırın başındaki girinti de korunur, çünkü backtick'lerin arasındaki her şey string'in parçasıdır.

const poem = `Roses are red,
Violets are blue,
Types are erased,
And so are you.`;
console.log(poem);

function card(title: string, body: string): string {
    return `
    [${title}]
    ${body}`; // the leading spaces and first newline are in the string
}
console.log(JSON.stringify(card("Note", "Hi")));

// Alternatives without the indentation problem:
const lines = ["first line", "second line"].join("\n");
console.log(lines);

Kodunuzun girintisi string'e sızacaksa onu bir dizi ve join("\n") ile oluşturun ya da template literal'in satırlarını satır başına dayalı tutun.

Bir String'in Alt String İçerip İçermediğini Kontrol Etmek

includes, "içeriyor mu" sorusunu bir boolean ile yanıtlar. startsWith ve endsWith baş ve sonu kontrol eder. indexOf konumu, alt string yoksa -1 verir. Hepsi büyük/küçük harfe duyarlıdır.

const file = "Report-2024.PDF";

console.log(file.includes("2024"));    // true
console.log(file.includes("pdf"));     // false: case-sensitive
console.log(file.toLowerCase().endsWith(".pdf")); // true
console.log(file.startsWith("Report")); // true
console.log(file.indexOf("-"));        // 6
console.log(file.indexOf("x"));        // -1

// A regular expression for patterns, with the i flag for case-insensitive
console.log(/report-\d{4}/i.test(file)); // true

includes bir başlangıç konumu da kabul eder: file.includes("R", 1) yalnızca 1. indeksten itibaren arar.

Yaygın Metotlar ve Tipleri

TypeScript her yerleşik metodun dönüş tipini bilir. Dikkat edilmesi gerekenler boş dönebilenlerdir, çünkü strict altında sonucu kullanmadan önce null veya undefined durumunu ele almanız gerekir.

const log = "error=404 path=/users";

const match = log.match(/error=(\d+)/);
// match is RegExpMatchArray | null: check before indexing
if (match) {
    console.log(Number(match[1])); // 404
}

const last = "abc".at(-1); // string | undefined
console.log(last?.toUpperCase()); // C

const parts = log.split(" ").map((p) => p.split("="));
console.log(parts); // [ [ 'error', '404' ], [ 'path', '/users' ] ]

Düz indeksleme, s[5], indeks sonun ötesinde olsa bile (çalışma zamanında değerin undefined olduğu yerde) string tipindedir. noUncheckedIndexedAccess derleyici seçeneği bunun yerine onu string | undefined yapar.

String'ler Değiştirilemez

Bir karakteri yerinde değiştiremezsiniz. TypeScript bir indekse atamayı TS2542 hatası olarak bildirir, Index signature in type 'String' only permits reading.; derlendiği strict mod JavaScript'te de aynı atama çalışma zamanında bir TypeError fırlatırdı. Bir string'i değiştiriyor gibi görünen her metot yeni bir string döndürür.

let word = "hello";

// @ts-expect-error: Index signature in type 'String' only permits reading.
const change = () => { word[0] = "H"; };

word = "H" + word.slice(1); // build a new string instead
console.log(word);          // Hello

Diğer değerleri string'e ya da string'leri sayıya dönüştürmek için string to number sayfasına bakın.

String Literal Tipleri

string her metni kabul eder. Bir string literal tipi ise tek bir tam değeri kabul eder ve bunların bir union'ı, izin verilen string'lerden enum benzeri bir küme oluşturur:

type Status = "draft" | "published" | "archived";

function label(status: Status): string {
    return `Post is ${status}`;
}

console.log(label("draft"));
// @ts-expect-error: Argument of type '"deleted"' is not assignable to parameter of type 'Status'.
console.log(label("deleted"));

Literal tipler yalnızca derleme zamanında kontrol edilir; çalışma zamanında label("deleted") yine de çalışır ve Post is deleted yazdırır, buradaki ikinci satırın yaptığı da budur. Template literal sözdizimi tip düzeyinde de çalışır; örneğin type EventName = `on${string}` ifadesi on ile başlayan her string'i kabul eder.