0Pricing
TypeScript Academy · Lekcja

Wbudowane typy manipulacji stringami

Używaj Uppercase, Lowercase, Capitalize i Uncapitalize

Wbudowane typy manipulacji stringami to bezpłatna lekcja TypeScript Academy na CoddyKit. To lekcja 4 z 4. Możesz przeczytać całą lekcję poniżej za darmo — a potem ćwiczyć ją interaktywnie w przeglądarce z wbudowanym edytorem kodu i tutorem AI dostępnym 24/7. To część ścieżki edukacyjnej TypeScript Academy, a Twój postęp synchronizuje się między webem a aplikacją CoddyKit. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Wbudowane transformatory napisów

TypeScript udostępnia cztery wbudowane typy do manipulowania napisami: Uppercase, Lowercase, Capitalize i Uncapitalize. Przekształcają one typy literałów napisowych w czasie kompilacji, bez żadnego kosztu w czasie działania.

Uppercase

Uppercase<S> zamienia każdy znak typu literału napisowego na wielką literę. Literał 'hello' staje się typem 'HELLO'.

type Loud = Uppercase<"hello"> // "HELLO"
const x: Loud = "HELLO"
console.log(x)

Lowercase

Lowercase<S> wykonuje operację odwrotną, zamieniając każdy znak na małą literę. 'HELLO' staje się 'hello'.

type Quiet = Lowercase<"HELLO"> // "hello"
const x: Quiet = "hello"
console.log(x)

Capitalize

Capitalize<S> zamienia na wielką literę tylko pierwszy znak, pozostawiając resztę bez zmian. 'name' staje się 'Name'.

type Title = Capitalize<"name"> // "Name"
const x: Title = "Name"
console.log(x)

Uncapitalize

Uncapitalize<S> zamienia na małą literę tylko pierwszy znak. 'Name' staje się 'name' — przydaje się to do przekształcania kluczy w zapisie PascalCase na zapis camelCase.

type Camel = Uncapitalize<"Name"> // "name"
const x: Camel = "name"
console.log(x)

Przekształcanie unii

Zastosowanie wbudowanego typu do unii przekształca każdy jej element. Uppercase zastosowany do 'a' | 'b' daje 'A' | 'B'.

type Keys = "id" | "name"
type Upper = Uppercase<Keys> // "ID" | "NAME"
const k: Upper = "ID"
console.log(k)

Łączenie z literałami szablonowymi

Wbudowane typy są najbardziej użyteczne wewnątrz typów literałów szablonowych. Szablon, który umieszcza get przed wynikiem zastosowania Capitalize do nazwy pola, tworzy nazwy getterów, na przykład getter dla pola name.

type Field = "name" | "age"
// template: get + Capitalize<Field> => "getName" | "getAge"
const g: "getName" | "getAge" = "getName"
console.log(g)

Tworzenie nazw kluczy w typach mapowanych

W ramach zmiany nazw kluczy typu mapowanego wbudowane typy generują przekształcone nazwy właściwości — na przykład zamieniają każdą właściwość w klucz handlera rozpoczynający się wielką literą.

type Events = "click" | "drag"
// { [E in Events as on + Capitalize<E>]: () => void }
// produces keys onClick and onDrag
const handlers: { onClick: () => void } = { onClick: () => {} }
console.log(typeof handlers.onClick)

Łączenie wbudowanych typów

Można zagnieżdżać wbudowane typy, aby łączyć przekształcenia — na przykład częstym połączeniem jest zastosowanie Capitalize do napisu przekształconego przez Lowercase w celu ujednolicenia wielkości liter.

type Normalized = Capitalize<Lowercase<"hELLO">> // "Hello"
const x: Normalized = "Hello"
console.log(x)

Tylko w czasie kompilacji

Te typy nie istnieją w czasie działania programu. Aby przekształcić rzeczywistą wartość typu string, nadal trzeba wywołać metodę taką jak toUpperCase(); wbudowane typy wpływają wyłącznie na typy statyczne.

function shout<S extends string>(s: S): Uppercase<S> {
  return s.toUpperCase() as Uppercase<S>
}
console.log(shout("hi")) // HI, typed as "HI"

Praktyczne zastosowania

Wbudowanych typów można używać do wyprowadzania stałych nazw, kluczy zdarzeń oraz nazw getterów i setterów, a także do ujednolicania wielkości liter w kluczach konfiguracji o typach literałowych — wszystko to jest sprawdzane przez kompilator.

type Action = "add" | "remove"
type ActionType = Uppercase<Action> // "ADD" | "REMOVE"
const a: ActionType = "ADD"
console.log(a)

Szybkie sprawdzenie

Sprawdź, czy rozumiesz wbudowane typy napisów.

Podsumowanie

Wbudowane typy Uppercase, Lowercase, Capitalize i Uncapitalize przekształcają typy literałów napisowych w czasie kompilacji, rozprowadzają przekształcenie po elementach unii i można je łączyć z typami literałów szablonowych oraz typami mapowanymi, aby tworzyć nazwy kluczy i handlerów. Nie mają żadnego działania w czasie wykonywania — do przekształcania napisów w czasie działania należy używać rzeczywistych metod napisowych, podczas gdy te typy kształtują typy statyczne.

Często zadawane pytania

Czy lekcja „Wbudowane typy manipulacji stringami” jest bezpłatna?

Tak — pełny tekst „Wbudowane typy manipulacji stringami” jest dostępny za darmo tutaj w sieci. Aby ćwiczyć ją interaktywnie (wbudowany edytor kodu i tutor AI dostępny 24/7) i odblokować resztę kursu TypeScript Academy, przejdź na CoddyKit PRO. Kurs TypeScript Academy zawiera 4 lekcji w sumie.

Co nauczysz się w „Wbudowane typy manipulacji stringami”?

Używaj Uppercase, Lowercase, Capitalize i Uncapitalize Ćwiczysz TypeScript Academy z praktycznym kodem, który uruchamiasz bezpośrednio w przeglądarce, a tutor AI dostępny 24/7 odpowiada na Twoje pytania podczas pracy nad lekcją.

Czy potrzebuję doświadczenia, aby zacząć TypeScript Academy?

Nie wymagamy żadnego doświadczenia. TypeScript Academy w CoddyKit jest strukturyzowany dla początkujących i zaawansowanych użytkowników, więc możesz zacząć tutaj lub od początku i uczyć się w swoim tempie. To lekcja 4 z 4.

Ile czasu zajmuje lekcja „Wbudowane typy manipulacji stringami”?

Większość lekcji CoddyKit trwa około 5–10 minut. Każda lekcja to mały, interaktywny krok, dzięki czemu robisz systematyczne postępy i zawsze wracasz dokładnie do tego samego miejsca — na webie i w aplikacji.

Czy mogę pisać i uruchamiać kod w tej lekcji TypeScript Academy?

Tak. Każda lekcja TypeScript Academy zawiera wbudowany edytor kodu, więc piszesz i uruchamiasz prawdziwy kod bezpośrednio w przeglądarce i od razu otrzymujesz sprzężenie zwrotne od AI — bez konfiguracji na komputerze.

Wszystkie lekcje w tym kursie

  1. Podstawy typów literałów szablonowych
  2. Modelowanie ustrukturyzowanych stringów
  3. Unie stringów i autouzupełnianie
  4. Wbudowane typy manipulacji stringami
← Powrót do TypeScript Academy