TypeScript: что такое и зачем

TypeScript — типизированное надмножество JavaScript, разработанное Microsoft: любой валидный JS-код является валидным TS-кодом, а компилятор tsc транспилирует TypeScript в чистый JavaScript, добавляя статическую проверку типов на этапе разработки.

Зачем нужно

TypeScript ловит целый класс ошибок — обращение к несуществующим свойствам, передача аргументов неверного типа, опечатки в именах — ещё до запуска кода. Это снижает количество runtime-ошибок, ускоряет рефакторинг за счёт автодополнения и делает код самодокументируемым.

Где используется

  • Крупные фронтенд-проекты (React, Vue, Angular)
  • Node.js backends (Express, Fastify, NestJS)
  • Библиотеки, предоставляющие типизированное API
  • Монорепозитории с shared-кодом
  • Любой проект, где важна поддерживаемость

Основной контент

TypeScript vs JavaScript

// JavaScript — ошибка только в рантайме
function greet(user) {
  return user.name.toUpperCase(); // TypeError если user = null
}

// TypeScript — ошибка на этапе компиляции
function greet(user: { name: string } | null): string {
  if (!user) return "Guest";
  return user.name.toUpperCase(); // TypeScript убедился что name есть
}

Ключевые возможности

// 1. Статическая типизация
const count: number = 42;
const message: string = "hello";
const active: boolean = true;

// 2. Автодополнение — TypeScript знает методы объекта
const arr = [1, 2, 3];
arr.map(n => n * 2); // IDE подсказывает все методы массива

// 3. Рефакторинг — переименование с гарантией
interface User { name: string; email: string }
// При переименовании поля TypeScript найдёт все использования

// 4. Null safety
function getLength(s: string | null): number {
  // return s.length; // Error: Object is possibly 'null'
  return s?.length ?? 0; // OK
}

Что TypeScript НЕ делает

// TypeScript удаляет типы при компиляции — в рантайме их нет
function double(n: number): number {
  return n * 2;
}
// После компиляции:
// function double(n) { return n * 2; }

// TypeScript не защищает от ошибок в рантайме если тип обошли через any или cast
const value: any = null;
value.toString(); // TypeScript не ругается, но упадёт в рантайме

// TypeScript не является runtime-валидатором
// Для валидации внешних данных нужен zod, yup или ручные проверки

Постепенная типизация

// Можно начать с any и постепенно уточнять
function processData(data: any) { // сначала any
  return data.items.map((item: any) => item.name);
}

// → Потом уточнить
interface DataItem { name: string }
interface Data { items: DataItem }

function processData(data: Data): string {
  return data.items.map(item => item.name);
}

TypeScript как документация

// Сигнатура функции — это уже документация
async function createOrder(
  userId: string,
  items: Array<{ productId: string; quantity: number }>,
  currency: "USD" | "EUR" | "RUB"
): Promise<{ orderId: string; total: number }> {
  // ...
}
// Понятно что принимает и что возвращает — без JSDoc

Частые ошибки

  • Думать что TypeScript = JavaScript с типами везде — TypeScript выводит типы сам; явные аннотации нужны только там где вывод невозможен.
  • Использовать any повсеместно — это отключает все проверки; лучше unknown с type guards или конкретный тип.
  • Путать ошибки компиляции с runtime-ошибками — TypeScript проверяет типы, но не гарантирует отсутствие ошибок в рантайме при работе с внешними данными.
  • Не включать strict: true — без него TypeScript значительно мягче и пропускает многие реальные ошибки.

Альтернативная точка зрения: TS как костыль

Не все согласны, что TS — отдельный язык:

  • автор: TS — это "галерный язык маленьких проектов". Большие проекты (Google Docs, YouTube, Figma, Gmail) — на чистом JavaScript. Для серьёзных систем лучше JS + .d.ts рядом.
  • AsForJS: TS-типы — это только статическая подсказка для IDE, а не гарантия рантайма. В V8 нет ни "примитивных типов", ни "номинальных интерфейсов" — всё это абстракции компилятора, исчезающие после tsc.

Эти позиции не отменяют пользу TS, но напоминают:

  1. TS не ускоряет код (типы исчезают при компиляции).
  2. TS не валидирует данные на границах (нужен zod/JSON Schema).
  3. TS — не строгое надмножество JS (есть валидный JS, который TS не типизирует).

Связанные темы

Источники

  • 🎓 TypeScript vs JavaScript: как лучше писать типы · 2025-11-08 · YouTube
  • 🎓 Я тип простой — я говорю стихами · AsForJS · 2023-03-29 · YouTube
  • 🎓 Как одни фантазируют на тему типов в JavaScript · AsForJS · 2021-10-10 · YouTube

Ресурсы