TypeScript Academy · Урок

Встроенные типы манипуляции строками

Используйте Uppercase, Lowercase, Capitalize и Uncapitalize

«Встроенные типы манипуляции строками» — бесплатный урок TypeScript Academy на CoddyKit. Это урок 4 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения TypeScript Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс TypeScript Academy содержит 4 уроков всего.

Встроенные преобразователи строк

TypeScript предоставляет четыре встроенных типа для работы со строками: Uppercase, Lowercase, Capitalize и Uncapitalize. Они преобразуют типы строковых литералов во время компиляции без затрат во время выполнения.

Верхний регистр

Uppercase<S> переводит каждый символ типа строкового литерала в верхний регистр. Литерал 'hello' становится типом 'HELLO'.

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

Нижний регистр

Lowercase<S> выполняет обратное преобразование, переводя каждый символ в нижний регистр. 'HELLO' становится 'hello'.

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

Прописная первая буква

Capitalize<S> переводит в верхний регистр только первый символ, оставляя остальные без изменений. 'name' становится 'Name'.

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

Строчная первая буква

Uncapitalize<S> переводит в нижний регистр только первый символ. 'Name' становится 'name' — это удобно для преобразования ключей в PascalCase в camelCase.

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

Преобразование объединения

Примените встроенный тип к объединению, и он преобразует каждый его элемент. Uppercase от 'a' | 'b' даёт 'A' | 'B'.

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

Комбинирование с шаблонными литералами

Встроенные типы особенно полезны внутри типов шаблонных литералов. Шаблон, который добавляет get перед результатом применения Capitalize, строит имена геттеров, например геттер для поля имени.

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

Построение имён ключей в отображаемых типах

При переназначении ключей отображаемого типа встроенные типы создают преобразованные имена свойств — например, превращают каждое свойство в имя ключа обработчика с прописной буквы.

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)

Цепочки встроенных типов

Вы можете вкладывать встроенные типы друг в друга, составляя последовательности преобразований. Например, сначала привести строку к нижнему регистру, а затем применить к ней Capitalize, чтобы нормализовать регистр.

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

Только во время компиляции

Эти типы не существуют во время выполнения. Чтобы преобразовать настоящее строковое значение, по-прежнему нужно вызывать методы вроде toUpperCase(); встроенные типы лишь формируют статические типы.

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

Практическое применение

Используйте встроенные типы для получения имён констант, ключей событий, имён геттеров и сеттеров, а также для нормализации регистра ключей конфигурации, типизированных как литералы, — всё это проверяется компилятором.

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

Быстрая проверка

Проверьте, насколько хорошо Вы поняли встроенные типы строк.

Итоги

Встроенные типы Uppercase, Lowercase, Capitalize и Uncapitalize преобразуют типы строковых литералов во время компиляции, распределяются по объединениям и комбинируются с типами шаблонных литералов и отображаемыми типами для построения имён ключей и обработчиков. Во время выполнения они никак себя не проявляют — для преобразования строк во время выполнения используйте настоящие строковые методы, а эти типы применяйте для формирования статических типов.

Часто задаваемые вопросы

Урок «Встроенные типы манипуляции строками» бесплатный?

Да — полный текст урока «Встроенные типы манипуляции строками» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс TypeScript Academy, подпишись на CoddyKit PRO. Курс TypeScript Academy содержит 4 уроков всего.

Чему я научусь в уроке «Встроенные типы манипуляции строками»?

Используйте Uppercase, Lowercase, Capitalize и Uncapitalize Ты практикуешь TypeScript Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать TypeScript Academy?

Предыдущий опыт не требуется. TypeScript Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 4 из 4.

Сколько времени занимает урок «Встроенные типы манипуляции строками»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке TypeScript Academy?

Да. Каждый урок TypeScript Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

← Назад к TypeScript Academy