Что такое TypeScript

Что такое TypeScript

TypeScript (TS) — это JavaScript с типами. Вы пишете типы для переменных, параметров и результатов, а программа (компилятор tsc или редактор) проверяет до запуска кода, что вы используете их правильно.

function total(price: number, qty: number): number {
  return price * qty
}

total(10, '2')   // ✗ ошибка в редакторе: '2' — не number, ещё до запуска

Важно понять: типы исчезают при сборке. Браузер получает обычный JavaScript. TS помогает только пока вы пишете код.

Почему это стоит того

• Ловите ошибки (опечатки, undefined, неверный аргумент) до запуска.
• Автодополнение — редактор знает, какие поля есть у объекта.
• Безопасный рефакторинг — переименовали поле, TS показывает все затронутые места.
• Живая документация — сигнатура функции говорит, что она принимает и что возвращает.

Цена: немного дополнительного синтаксиса. Next.js, React и все современные библиотеки написаны на TS.

Аннотации типов

let name: string = 'Ana'
let age: number = 30
let active: boolean = true
let tags: string[] = ['js', 'ts']           // массив строк
let point: [number, number] = [10, 20]      // кортеж — фиксированные длина и типы

function greet(name: string, excited?: boolean): string {  // ? = необязательный параметр
  return excited ? `Привет, ${name}!` : `Привет, ${name}`
}

Вывод типов — не пишите типы везде

TS выводит тип из значения:

let count = 0              // TS знает: number
const user = { name: 'Ana' }  // { name: string }
const doubled = [1, 2].map(n => n * 2)   // number[]

Практическое правило: пишите типы для параметров функций и для данных извне (API, формы). Остальное оставьте выводу.

Особые типы — различия и когда

any или unknown:

const a: any = JSON.parse(text)
a.foo.bar()            // TS молчит — падает во время выполнения

const u: unknown = JSON.parse(text)
u.foo                  // ✗ TS: сначала проверьте, что это
if (typeof u === 'object' && u !== null && 'foo' in u) { ... }   // ✓

Литеральные типы

Тип может быть точным значением:

let size: 'sm' | 'md' | 'lg' = 'md'
size = 'xl'            // ✗ нет в списке

Именно так типизированы варианты кнопки в этом приложении.

Настройка

tsconfig.json управляет проверкой. Самая важная опция: "strict": true — включает все полезные проверки (в том числе null/undefined). Next ставит её по умолчанию.

Коротко

• TS = JS + типы, проверяемые до запуска; во время выполнения их нет.
• Типы — на параметрах и данных извне; остальное — вывод типов.
• unknown вместо any; всегда strict: true.

Официальные источники

• TypeScript — The Basics
• TypeScript — Everyday Types
• TypeScript — TSConfig strict