Chuỗi trong TypeScript: nội suy, nhiều dòng và includes

Chuỗi (string) trong TypeScript là một chuỗi JavaScript mang kiểu string. Để nội suy, hãy viết một template literal: dấu backtick với các placeholder ${expression}. Dấu nháy đơn và nháy kép tạo ra chuỗi thường, không có nội suy.

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}`);

Cả ba kiểu dấu nháy đều cho ra cùng một kiểu, string. Dấu $ đầu tiên trong $${...} là ký tự đô la bình thường; chỉ ${ mới mở đầu một placeholder.

Nội suy chuỗi

Bên trong ${ } bạn có thể đặt một biến, một phép tính, một lời gọi hàm, một toán tử ba ngôi hay một template literal lồng nhau. Giá trị được chuyển thành chuỗi giống như cách String(value) chuyển đổi (ngoại lệ là symbol: nội suy một symbol là lỗi biên dịch TS2731, và lúc chạy sẽ ném ra TypeError; hãy viết String(sym)).

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

Nội suy một đối tượng sẽ in ra [object Object], gần như không bao giờ là thứ bạn muốn. Hãy chọn các trường cần thiết, hoặc dùng JSON.stringify(obj).

Chuỗi nhiều dòng

Một template literal có thể trải dài qua nhiều dòng. Các ký tự xuống dòng được giữ lại, và cả phần thụt lề ở đầu mỗi dòng cũng vậy, vì mọi thứ giữa hai dấu backtick đều thuộc về chuỗi.

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);

Khi phần thụt lề của code có thể lọt vào chuỗi, hãy tạo chuỗi bằng một mảng và join("\n"), hoặc viết các dòng của template literal sát lề trái.

Kiểm tra một chuỗi có chứa chuỗi con không

includes trả lời câu hỏi "có chứa không" bằng một boolean. startsWith và endsWith kiểm tra hai đầu chuỗi. indexOf cho vị trí, hoặc -1 khi không có chuỗi con đó. Tất cả đều phân biệt chữ hoa chữ thường.

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 cũng nhận vị trí bắt đầu: file.includes("R", 1) chỉ tìm từ chỉ số 1 trở đi.

Các phương thức thường dùng và kiểu của chúng

TypeScript biết kiểu trả về của mọi phương thức có sẵn. Cần chú ý những phương thức có thể trả về rỗng, vì khi bật strict bạn phải xử lý null hoặc undefined trước khi dùng kết quả.

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' ] ]

Truy cập chỉ số thông thường, s[5], có kiểu string ngay cả khi chỉ số vượt quá cuối chuỗi (lúc chạy giá trị khi đó là undefined). Tùy chọn trình biên dịch noUncheckedIndexedAccess sẽ đổi nó thành string | undefined.

Chuỗi là bất biến

Bạn không thể thay đổi một ký tự tại chỗ. TypeScript báo phép gán vào một chỉ số là lỗi TS2542, Index signature in type 'String' only permits reading., và trong JavaScript ở strict mode mà nó được biên dịch ra, cùng phép gán đó sẽ ném ra TypeError lúc chạy. Mọi phương thức trông như sửa chuỗi thật ra đều trả về một chuỗi mới.

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

Để chuyển các giá trị khác thành chuỗi, hoặc chuỗi thành số, xem chuyển string sang number.

String literal type

string chấp nhận văn bản bất kỳ. Một string literal type chỉ chấp nhận đúng một giá trị, và union của chúng tạo ra một tập chuỗi được phép, giống như enum:

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 type chỉ được kiểm tra lúc biên dịch; lúc chạy label("deleted") vẫn chạy và in ra Post is deleted, đúng như dòng thứ hai ở đây. Cú pháp template literal cũng dùng được ở cấp kiểu, như type EventName = `on${string}`, kiểu này chấp nhận mọi chuỗi bắt đầu bằng on.